Sendo um desenvolvedor que quer ser designer, estou realmente interessado em aprender a criar uma interface de usuário de alto nível para sites, aplicativos móveis, etc. No entanto, não sei nada sobre o PhotoShop ou qualquer coisa relacionada ao design, exceto HTML e CSS.
Por onde devo começar? Como aprendo a criar belos sites e interfaces projetados?
Existe um livro, tutorial etc. que você recomenda?
Obrigado!
Respostas:
Para a interface do usuário, recomendo usar o Fireworks sobre o Photoshop. O Photoshop é ótimo para trabalhos artísticos criativos e complexos (impressos ou na web), mas, na minha opinião, uma ferramenta excessivamente complexa para a interface do usuário relacionada à web.
O Fireworks foi projetado especificamente como uma ferramenta de criação orientada para a Web, onde o Photoshop não é. O conjunto de ferramentas do Fireworks é voltado para a criação da interface do usuário da web, não para o trabalho criativo complexo oferecido pelo Photoshop.
O Fireworks usa uma ferramenta muito semelhante ao Photoshop, menos o inchaço, para que você possa fazer tudo o que precisa para criar uma interface da web.
O Fireworks também faz parte do Adobe Creative Suite; portanto, se você possui o Photoshop, também deve fazê-lo.
Material de referência, não específico para o Fireworks, mas a interface do usuário em geral;
http://www.jankoatwarpspeed.com/
Eu recomendo a leitura de seus artigos e a inspiração para seu trabalho. Existem dois lados da interface do usuário, que ele cobre muito bem: a interface e a experiência de usar a interface. Também conhecido como UI e UX.
Você pode aprender como usar o aplicativo através de tutoriais online. A Envato possui uma ótima rede de tutoriais http://tutsplus.com/ , com a garantia de que o site principal do Tutorial para a Web é orientado para o Photoshop, mas a maior parte do que eles fazem no Photoshop é feita no mesmo método ou no Fireworks.
Também me vejo frequentemente marcando sites com características de design exclusivas ou elementos de interface do usuário que, em algum cenário futuro, funcionariam bem para um projeto. Por exemplo, uma estrutura de guias exclusiva, estilo accordian ou mesmo um pager.
A interface do usuário de design em um nível básico é dividida em áreas de exibição de dados. Como você possui experiência em desenvolvimento, sabe como apresentar dados de uma perspectiva lógica (menus, acordeões, guias etc.). Agora, é realmente apenas criar essa interface do usuário usando esses controles ou módulos de uma perspectiva visual.
Algumas leituras adicionais no UX:
Também com experiência em desenvolvimento, posso dizer que, quando crio meus aplicativos, o primeiro passo é criar a interface do usuário, que por sua vez define a funcionalidade dos aplicativos. Meu trabalho artístico criado serve como valor artístico para o aplicativo, mas também como definição de função. Eu sempre construo minha lógica em torno da arte finalizada, nunca o contrário. Isso sempre significa que eu coloco o usuário em primeiro lugar.
Espero que isso lhe dê pelo menos um ponto de partida.
Você está com sorte. Muitas pessoas vieram ao mundo do Web Design fazendo a mesma pergunta. Muitas vezes, você verá uma equipe de pessoas, composta de pelo menos um codificador e um designer gráfico. Boa escolha com o Photoshop - é com isso que fico.
Com a versão mais recente do Adobe Photoshop, CS5, tornou-se intensamente avançada - capaz de executar tarefas complexas com ferramentas simples ou tarefas ainda mais complexas com ferramentas complexas. Mas eu aviso, aprender todos os recursos interessantes do Photoshop pode levar à falta de nutrientes. :)
Aqui está um tutorial que aborda o básico para que você possa entender as coisas:
Depois de conseguir tudo isso para baixo, eu encontrei um monte de locais no Google que têm alguns tutoriais de design realmente inovadoras.
Existem algumas técnicas que você pode precisar aprender. Uma dica, brilhante é geralmente um bom passo nos dias de hoje. Para obter um design verdadeiramente exclusivo, encontre os recursos que você gosta em qualquer modelo de site e use-o do seu jeito.
Espero que tenha ajudado. Deixe um comentário se precisar de mais informações.