Ter uma boa base de ferramentas deve ser um princípio de qualquer webdesigner ou desenvolvedor, e a utilização de Wireframes e Mockups está na ordem do dia. No entanto, nem todos os webdesigners e desenvolvedores optam pela utilização destas ferramentas, abolindo por completo estas soluções. Pessoalmente penso que é útil e produtivo utilizar, pois na fase inicial dos projectos é vital poder passar as suas ideias e as ideias dos clientes para um esquema, começando a delinear o aspecto do projecto. Um boa aplicação de Wireframes e Mockups pode ser muito dispendiosa, e por isso mesmo decidimos fazer uma selecção daquelas que achamos serem as melhores soluções do mercado, tanto gratuitas como pagas. Assim apresentamos-lhe neste artigo 20 Aplicações para Wireframe e Mockups!

1. SERENA PROTOTYPE COMPOSER

Serena

Serena Composer Prototype ajuda-o a simular rapidamente e com precisão como um aplicativo vai olhar e funcionar sem escrever qualquer código. Em vez de entradas de texto sem fim, as hierarquias de dados complexos, ou diagramas UML técnicos, Serena Composer Prototype torna fácil trabalhar nos projectos, com protótipos de alta fidelidade que se parecem com o resultado final.

2. WEB SITE WIREFRAME TOOL

Web Site Wireframe Tool

Web Site Wireframe Tool é uma ferramenta baseada na web para a construção de wireframes de websites. Um wireframe é simplesmente um arranjo visual do conteúdo do site, que permite que o desenvolvedor e o cliente a façam o planeamento do layout de um site de conteúdo sem grande desperdício de tempo. Esta ferramenta permite que o wireframe seja construído em poucos minutos, podendo ainda enviar um link para da pré-visualização do wireframe por e-mail, mensagem instantânea, ou mesmo por telefone para o seu cliente. Com ambas as partes capazes de ver o wireframe até mesmo a partir de locais diferentes, o wireframe pode facilmente ser atualizado com base no feedback, discussão, idéias e sugestões do cliente.

3. LUMZY

Lumzy

Lumzy é uma ferramenta de criação de Mockups e protótipos para websites e aplicações, podendo esboços rapidamente para dar uma ideia de como o site ou aplicativo que você está a criar será. Com Lumzy, você pode criar protótipos de como o site ou aplicativo vai funcionar, adicionando eventos dentro dos controles de Lumzy. Por exemplo, o que acontece quando o usuário clica em um botão? Você pode criar alertas de mensagens, navegação entre páginas ou links para conteúdo externo quando o cliente interage com o Mockup.

4. AXURE

Axure

Axure RP é um software de wireframe interativo que lhe dá o poder de criar mockups e protótipos de forma rápida e fácil tirando partido das suas ferramentas. Pode criar rapidamente um wireframe de um site interativo em HTML ou uma maquete, apenas em alguns minutos. Tirando partido das suas funcionalidades, você poderá enviar um link para os seus clientes ou colaboradores para revisão. Com Axure, poderá criar uma interface Android ou para iPhone e visualizá-lo directamente no seu dispositivo móvel. Mais de 30.000 profissionais estão a utilizar Axure RP para mais de 10.000 organizações em todo o mundo!

5. JUMPCHART

Jumpchart

Jumpstart é um aplicativo para a criarção de wireframe projetado para fazer sites de forma simples, rápida e eficiente. É fantástico para desenvolvedores web e proprietários de sites. É possível exportar o seu layout para HTML e para WordPress.

6. HOTGLOO

HotGloo combina todas as funcionalidades de um software de desktop clássico com o conforto e os benefícios de uma aplicação web. Com HotGloo você pode finalmente alcançar grandes conceitos de uma maneira rápida, simples e com um bonito resultado. Crie mockups, obtenha feedback e melhore ao longo do tempo. Com apenas um clique você pode receber informações sobre um determinado elemento ou interação, ajudando-o a ajustar em conformidade.

7. GUI DESIGN STUDIO

GUI Design Studio

GUI Design Studio é uma ferramenta de design de software especializada para qualquer pessoa envolvida no design de interface, incluindo Designers, Analistas de Negócios, Desenvolvedores, Gerentes de Projeto e Consultores. Use GUI Design Studio quando você precisa de segurar um cliente e começar logo bem desde o início, para atender aos requisitos do seu cliente.

8. TIGGZI

Tiggzi

Construa aplicativos Mobile Web (HTML5), Android e iOS. Use PhoneGap para acessar recursos do dispositivo nativos. Não necessita de instalar nada para utilizar o Tiggzi, e em poucos minutos você poderá criar belos aplicativos móveis para qualquer dispositivo na nuvem, sempre disponível em tiggzi.com

9. MOCKABILLY

Mockabilly cria mockups interativas sobre qualquer projeto que você quiser. Sincronize facilmente ou faça upload das suas ideias e crie mockups instantâneas iPhone com a interação perto do real. Com Mockabilly você irá ter mais facilidade em envolver-se nas ideias dos seus clientes e chegar a um resultado final que vai certamente de encontro aos interesses do cliente!

10. MOCKFLOW

Mockflow

MockFlow é um conjunto de wireframing profissional para projetar interfaces de usuário. Ele fornece um serviço online com capacidades colaborativas, de forma a melhorar o processo de planejamento, permitindo rapidamente criar, compartilhar e documentar projetos de interface de usuário interativas com outras pessoas.

11. FLUIDIA

fluidIa

fluidIA é uma ferramenta emergente de design ágil para prototipagem de interfaces de usuário. A grande ideia por trás deste experimento é que os designers de interação, os profissionais de IA, UX e desenvolvedores possam criar a sua própria ferramenta de prototipagem de uma forma aberta. Fluidia é fornecido como um projeto aberto e Open Source.

12. DUB – DENIM

Dub Denim é um clone do projeto original SILK, uma ferramenta baseada em caneta para a concepção de interfaces de usuário. SILK combina muitas das vantagens do papel, baseado em esboços, tirando partido das atuais ferramentas de prototipagem digitais. Ele permite que os projetistas criem rapidamente o esboço de uma interface usando um teclado e caneta digital. No entanto, ao contrário de um esboço de papel, este esboço digital é interativo e pode facilmente ser modificado através de gestos de edição.

13. IPHONE MOCKUP WEB APP

iPhone Mockup Web App

iPhone Mockup Web App permite-lhe criar de forma rápida os seus próprios protótipos de aplicativos iPhone, compartilhá-los com outras pessoas, e fazer as alterações que são sincronizadas com todos os colaboradores que têm o URL do mockup.

14. FRAME BOX

Framebox

Framebox é um aplicativo web que lhe traz um conjunto de ferramentas essenciais para a criação de um mockup em poucos minutos. Além disso, você pode guardar a mockup e partilhá-la com os seus colaboradores para serem feitas alterações e revisões ao conteúdo.

15. BALSAMIQ MOCKUPS

Ao utilizar Balsamiq Mockups você irá sentir-se como se estivesse a desenhar, mas na era digital. Você pode ajustar e reorganizar facilmente o conteúdo, e rapidamente um conjunto de colaboradores podem pegar num projeto e iterar sobre ele em tempo real no decorrer de uma reunião. Os gerentes de produtos, designers, desenvolvedores e até mesmo clientes podem agora trabalhar em conjunto na mesma ferramenta para rapidamente opinar sobre wireframes, antes de passar ao código.

16. MOCKINGBIRD

Mockingbird

Mockingbird é uma ferramenta online que torna mais fácil você criar, unir, visualizar emaquetes das ações de seu site ou aplicativo. Simples como isso!

17. CREATELY

Creately

Creately é uma ferramenta wireframe web-based para a criação de Mockups Web rápidas e protótipos de software e wireframes.Tente Creately Agora, para criar Wireframes e modelos de interface do usuário para o seu site e projetos de software.

18. UXPIN

Notepads UXPin vai fazer com que você se pareça bem. Você ira projetar rapidamente através da UI de UXpin, criando um protótipo que parece muito melhor do que a maioria dos esboços. Leve o seu UXPin para a reunião com o cliente e demonstre o seu profissionalismo, impressionando os seus clientes com uma ferramenta como esta.

19. PENCIL PROJECT

Pencil Project

Projecto Pencil é uma ferramenta para elaboração de diagramas e de protótipos de GUI com uma infinidade de recursos, em forma de addon gratuito e Open Source para Firefox. Com as suas ferramentas para diagramação e prototipagem, a opção para documentos de várias páginas, entre outras funcionalidades, Pencil Project torna torna-se um addon essencial para qualquer desenvolvedor ou designer.

20. MOCKUP BUILDER

Mockup Builder é o software que permite que você faça um protótipo de um site e novo design rapidamente e com qualidade. Mockup tem todas as ferramentas necessárias para dar a aparência original daquilo que irá ser o website, tirando partido dos numerosos elementos de UI para o desenvolvimento de ideias nos projectos.

Abraço!

 

Autor: Diogo Espinha

Blog do Autor | Artigos do Autor:

Workaholic e totalmente viciado em computadores, Internet e desporto motorizado. Adora praticar desporto, é um curioso da programação em PHP, CSS e HTML5 e não dispensa a companhia do seu Mac OSX 86 Snow Leopard!

Templates Incríveis para seus Projetos:

  • Trizzy - Multi-Purpose eCommerce Drupal Theme
  • Kane Responsive Joomla App Landing Page
  • Brevis MultiPurpose Corporate Joomla Template
  • Club Cube - responsive MODX theme for night club
  • Prototype - Premium Flat Drupal Theme
  • Flatize - Fashion eCommerce Joomla Template
  • BT Medical | Responsive medical joomla template
  • Car Dealer - multipurpose product directory
  • Vina Optima - Multi-Store Joomla 3.x Template
  • Craftsmen: Responsive Multipurpose Joomla Template
  • Premiumlayers: Mura CMS Responsive vCard Theme
  • Pompey - Parallax One Page Joomla Template

Gostou deste artigo? Então torne-se fã do Blog no Facebook!



Comentários dos Alunos


  1. Jose Correia
    20 de abril de 2012

    o que e mock ops e wirerame?

    Responder


  2. Citizeum
    23 de abril de 2012

    Diogo, parabéns pelas dicas apresentadas neste artigo!

    De fato, wireframes e mockups são essenciais para idealizar um protótipo de sucesso. Webdesigers só tendem a ganhar quanto utilizam estas ferramentas de forma adequada.

    Responder


  3. Pedro Mendes
    24 de abril de 2012

    Chega de fazer mockup na “mão” né!?

    Ótimas tools… gostei da mockflow!

    Responder


  4. Andreas
    2 de maio de 2012

    También podrian darle un vistazo a PowerMockup, un set de herramientas para crear wireframes en Microsoft PowerPoint. Esta disponible en http://www.powermockup.com/

    Responder


  5. Kennedy
    22 de novembro de 2013

    Muito bom seu artigo!!!

    Parabens…

    Responder

Comente o Artigo!

RSS
Twitter
Facebook
Comentários
ASSINANTES
SEGUIDORES
FÃS
COMENTÁRIOS
7687

Subscrever Newsletter
Subscreva a Newsletter:



Aplicativos Android, iPhone e Muito Mais!




Assine a Escola Criatividade Assine a Newsletter da Escola Criatividade Escola Criatividade no Twitter Escola Criatividade no Facebook Escola Criatividade no Youtube Escola Criatividade no Google Buzz