Better Software through the UI Design (Rubyconf BR 2011)

Palestra apresentada na RubyConf Brasil 2011. Vídeo completo pode ser visto aqui: http://bit.ly/tR0TPf

Transcript

7. SOFTWARES através da criando melh es INTERFACE
11. SEUS USUÁRIOS
16. Seductive Interaction Design - Stephen P. Anderson
17. MÉTODOS DE TRABALHO
24. design PÓS - DESENVOLVIMENTO
26. ...
36. design PRÉ - DESENVOLVIMENTO
37. DESIGN com outra ab dagem
39. Design is not just what it looks like... Design is how it works. “ ” Steve Jobs
40. You've got to start with the customer exp. and work backwards to the technology. “ ” Steve Jobs
41. várias iterações são essenciais para produzir interface efetiva. “ ” Clayton Lewis -TCUID
42. UI is software, so designers should know how to program. “ ” Ryan Singer - 37signals
43. SOLUÇÃO com outra ab dagem
49. CODE DESIGN
50. CODE DESIGN
51. CODE DESIGN
52. Eu preciso administrar as localidades nos depósitos dos meus almoxarifados. PROBLEMA
53. $ rails g scaffold location name:string deposit:references
64. Rubyconf::Application.routes.draw do scope '/mockups', :constraints => lambda { not Rails.env.production? } do match '/:action', :controller => 'mockups', :actions => /[^\/]+/ end end
65. class MockupsController < ApplicationController def locations end end
66. class MockupsController < ApplicationController # lockers def lockers_list end def new_locker end # slots def locker_slots end def new_locker_slot end # usage def new_locker_usage end def destroy_locker_usage end end
67. <div class="page-header"> <h1> Localidades <%= search_field_tag :search, "", :placeholder => "Filtrar por localidades ou depósitos", :style => "float:right; margin: 5px;" %> </h1> </div> <div class="row"> <div class="span14"> <% 10.times do %> <p style="padding: 5px; background: #e9e9e9; font-weight:bold; color: #000;"> Almoxarifado </p> <style type="text/css" media="screen"> li { border-bottom: 1px solid #EFEFEF; line-height: 25px; list-style: none; } </style> <ul> <li>B02</li> <li>B03</li> <li>Chapa Bancada</li> <li>Pré-produção</li> <li>Término de produção</li> ...
76. CODE DESIGN
78. • Comece pela interface • Iterações • UI é o seu software
79. MUITO OBRIGADO
80. objetiva.co/publications
81. TWITTER DANIELVLOPES EMAIL DANIEL@OBJETIVA.CO DRIBBBLE DANIELVLOPES