- danielmall.com
- Henry Ford moveu as pessoas que cuidavam da montagem do motor para mais perto umas das outras, assim ele reduziu custos e usou poucos trabalhadores, mais bem preparados e bem pagos, para fazer bem as coisas.
- Waterfall (fluxo linear) é ruim. Não é paralelo. É muito engessado.
- Muitas empresas tem equipes no modelo de montagem em linha. Um processo típico waterfall consistem em pequenas partes, isoladas: você finaliza uma tarefa e corre para próxima. Hoje, o processo de design precisa ser mais interativo porque nós temos múltiplas telas e dispositivos.
- Use um framework para atestar a qualidade dos seus sistemas não processos.
- Um framework tem restrições, não regras. É como um jogo de futebol: tem 90 minutos e um campo pré-determinado, mas o que acontece nesses 90 minutos e no campo sempre é uma surpresa.
- UX, Designers e desenvolvedores não devem competir entre si. Eles precisam cooperar. Não existe uma tarefa de design, ou uma tarefa do desenvolvedor, existe apenas UMA tarefa, que envolve todas as áreas para ser cumprida.
- O envolvimento das áreas são temperadas durante os processos.
- Crie pontos de foco: comece e termine os projetos em um mesmo lugar. Kick-offs são bons para iniciar os pontos focais. Repita as fases, comprima isso em pequenas tarefas e objetivos.
Modern Web design process:
1. Plain
Pesquisa
É necessário pesquisar e entender o que funciona e o que não funciona.
Trabalhar com Hipoteses
Quando você trabalha com hipóteses você consegue respostas mais rápido. Você viaja em visões diferentes de um mesmo problema.
Tenha uma visão do que o produto será. Compare esta visão com as pesquisas que faz.
2. Inventory
Inventário de conteúdo
- Livro – The Elements of Content Statrategy
- Você precisa trabalhar com a possibilidade de formatos no conteúdo: listas, parágrafos, títulos, citações e etc.
- Faça um mapa do conteúdo do site. Para que serve cada página? Qual o tipo de conteúdo deve haver em cada página?
- Uma atitude normal que envolve o Web Design é mostrar para as pessoas como seus sites irão aparecer em dispositivos específicos. Em vez disso, mostre como o site poderá se comportar em diversas telas. Isso é mais flexível.
Performance Budgets
- Faça um inventário dos sites competidores.
- Compare a performance de cada um.
Pattern Inventory
- Faça uma lista dos átomos (elementos e módulos do site)
- Organize isso em organismos
Visual Inventory
- Normalmente designers tem questões sobre cores, tipografia, conceitos, metáforas. São perguntas normais na hora da produção.
- Tenha uma inventário visual do cliente e veja se as partes combinam, se elas trabalham juntas, se elas se conversam. Fazendo assim você consegue entender se algo precisa mudar para trabalhar melhor seu layout.
- As cores serão flat? Saturadas, Monocromatico?
- O Conceito será mais narrativa, será um caso de estudo direcionado?
- O tom precisa ser mais profissional? Mais engraçado? Mais básico?
- Comece com as fonts: sempre comece com a tipografia. Em telas pequenas, muitos dos modelos visuais podem ter problemas críticos de font.
3. Sketch
Explore ideias de modo rápido e rascunhado
Content reference wireframees
- Livro – Responsive Design Workkflow – Stephen Way
- liste as coisas que precisam estar na página. Depois organize blocos em uma página, dando prioridades para essas coisas Lembre-se que nem sempre o primeiro é o mais importante ou precisa ser maior que outras áreas.
Element Collages
- Transform frases poderosas em ancoras visuais.
- Desenhe elementos e comece a colocá-los em uma mesma página no photoshop e veja como eles se comportam.
- Crie entregáveis que permitam revelar partes do processo de design para os clientes.
- É óbvio que isso não será um website. Mas você consegue ver como pode ser um website vendo a combinação dos elementos e como eles se comportam juntos.
- Para que o cliente não entenda que isso é um website, faça uma espécie de cartilha horizontal, mostrando todos os elementos e opções alternativas de cores e formas.
- “Element collages are like giving your client a peek at all those hidden layers” Paul Lloyd
Prototypes
- Protótipos de funcionalidades devem resolver um problema, específico, e só aquele problema.
Assemble
Colocando tudo junto.
Presets
- Um template é como um preset (conjunto de “configurações” já preparado) é a junção de módulos e organismos. Princípio do Design Atomico
- Fazer presets ajuda a criar templates modulares e fáceis de manter.
- Responsive Design não é difícil mas traz muitos desafios que sempre estavam lá: performance, workflows, accessibility, benefícios para o negócio.