¿Qué software es mejor para el diseño de GUI?


9

He usado Photoshop ampliamente, pero el hecho es que es una herramienta de edición de fotos. Tiene algunos efectos complicados incorporados, como la sombra paralela y los brillos internos y externos, etc., pero simplemente no es suficiente al diseñar una interfaz gráfica. No puede agregar múltiples gradientes editables, por ejemplo. Y tienes que engañar a las herramientas para que logren el efecto que deseas, cuando no fueron diseñadas para eso.

También comencé a usar Fireworks, y hay algunas cosas que me gustan, como poder seguir cambiando las curvas en un rectángulo redondeado, pero el selector de color en ese programa simplemente no se puede usar. Cuando ingresa al selector de color de mac, dice que el color es algo diferente de lo que es, debido a que Fireworks no maneja los perfiles de color correctamente. Esto hace que el ajuste de colores sea un proceso muy difícil. Y el software en su conjunto se siente como una versión preliminar (y tal vez debería serlo).

Entonces, me pregunto qué software recomendarían todos para crear una GUI. Debe haber algún software que le permita tener una gama de efectos editables que pueda cambiar, cambiar el orden o moverse en cualquier momento, junto con todas las otras herramientas necesarias para crear excelentes gráficos.


Según todas las respuestas aquí, necesitamos que aclare la pregunta. Creo que está solicitando un software para crear los elementos de la GUI reales ... iconos, botones, etc. ¿O está preguntando acerca de la estructura de alambre?
DA01

Respuestas:


7

No existe un "mejor" software universal para el diseño de GUI. Solo depende de sus preferencias de software / flujo de trabajo.

Photoshop

No estoy seguro de lo que quiere decir con "gradientes editables múltiples", pero si sabe lo que está haciendo, Photoshop proporciona todas las herramientas que necesita para diseñar cualquier GUI que pueda imaginar. No se necesitan "trucos" de herramientas.

A pesar de su nombre, Photoshop ha evolucionado mucho más allá de ser una simple herramienta de edición / manipulación de fotos, y no hay ninguna razón por la que no pueda hacer un diseño GUI en ella. Photoshop probablemente proporciona el conjunto más completo de herramientas de edición de imágenes ráster de cualquier programa de gráficos en el mercado, y se usa para todo, desde pintura digital hasta coloración de cómics, ilustración, diseño web y de interfaz de usuario, producción de video y creación de juegos en 3D e incluso fotos. forense

Las características como máscaras de ajuste, estilos de capa, trazados vectoriales, objetos inteligentes, composiciones de capas, etc., lo convierten en una opción natural para el diseño de la interfaz de usuario para aquellos que ya están familiarizados con su interfaz y su conjunto de características profundo. Otra ventaja es que está bien integrado con herramientas como Illustrator, Flash Catalyst y muchas aplicaciones / complementos de terceros.

Fuegos artificiales

Muchas personas prefieren Fireworks para el diseño web, ya que para eso fue diseñado específicamente, y por esta razón también es una buena herramienta para el diseño de GUI. Al ser orientado a objetos y soportar páginas, símbolos y estilos, Fireworks se presta muy bien a un flujo de trabajo de diseño UX. Mucha gente también encuentra que Fireworks les brinda un mejor control de píxeles perfectos sin recurrir a reglas, guías o herramientas de medición.

Además, Fireworks tiene muchas características interesantes, como tramado degradado, muestras ASE y, de alguna manera, un mejor control de la tipografía que Photoshop. La capa web de Fireworks y su integración con Device Central de Adobe también facilita la creación rápida de prototipos para múltiples dispositivos.

Ilustrador

Otra aplicación popular entre los diseñadores de UX es Illustrator, que comparte muchas fortalezas con Fireworks. Al igual que Fireworks, admite símbolos, estilos de objetos avanzados, múltiples mesas de trabajo (similares a las páginas) e incluso mejores instalaciones de edición de vectores.

Photoshop, Fireworks, Illustrator, así como InDesign, todos tienen kits de estructura alámbrica / plantilla y plantillas de UX disponibles para ellos en la web, pero el diseño de UX modular es más fácil en Illustrator y Fireworks debido a su soporte para bibliotecas de símbolos reutilizables.

Illustrator también admite estilos de caracteres y párrafos, lo que hace que sus características de diseño de tipografía sean muy superiores a Photoshop o Fireworks. Además, Illustrator es excelente para la ilustración, por lo que cualquier ícono o gráfico web que desee crear se puede hacer en el mismo programa.

InDesign

InDesign es otra aplicación muy popular entre IAs, IxDs, etc. Sus instalaciones de diseño gráfico pueden ser limitadas, pero su soporte para páginas, estilos de párrafos y caracteres, fragmentos y bibliotecas de objetos lo hacen ideal para muchas tareas de diseño UX. InDesign también cuenta con instalaciones de composición tipográfica muy avanzadas y admite diseños de cuadrícula. Esto, junto con la integración de InCopy y Adobe Digital Publishing Suite, lo convierten en una opción natural para las compañías de medios impresos que buscan diseñar aplicaciones móviles para sus revistas.


Pero al final del día, cada herramienta tiene sus fortalezas y debilidades. Las aplicaciones más específicas de UX como Axure, Balsamiq, OmniGraffle, etc. tienen una gran cantidad de excelentes características específicas de UX para diseño de diseño / interacción / estructura metálica. Pero al final del día, aún necesita diseñar los gráficos para la interfaz de usuario, para lo cual se necesitan herramientas de diseño gráfico como Photoshop / Fireworks / Illustrator.

Es por eso que la mayoría de los flujos de trabajo de diseño de IU incluyen más de una aplicación. Por lo tanto, a menos que solo le interese una sola parte del proceso de diseño de la interfaz de usuario, por ejemplo, la estructura de alambre o la construcción de la biblioteca UX o la creación de prototipos, entonces no habrá un solo "mejor software".


2

Pencil es una herramienta de diseño GUI pequeña y fácil de usar.

Top features:
Built-in stencils for diagraming and prototyping
Multi-page document with background page
Inter-page linkings!
On-screen text editing with rich-text supports
Exporting to HTML, PNG, Openoffice.org document, Word document and PDF.
Undo/redo supports
Installing user-defined stencils and templates
Standard drawing operations: aligning, z-ordering, scaling, rotating...
Cross-platforms
Adding external objects
Personal Collection
Clipart Browser
Object snapping
Sketchy Stencil
And much more...

ingrese la descripción de la imagen aquí


Es una buena herramienta de estructura de alambre, pero creo que el OP estaba buscando una herramienta de edición gráfica.
DA01

1

Donde trabajo utilizamos Indesign. Tendemos a crear diseños limpios basados ​​en cuadrículas con estilos tipográficos cuidadosos, y para esos Indesign es genial. Tiene un control preciso sobre los estilos de caracteres, párrafos y objetos, lo que se traduce bien en CSS y permite ajustar estos elementos en cualquier punto del proceso, además de permitir un diseño más coherente. No es tan bueno al exportar elementos gráficos, pero creemos que el intercambio vale la pena.


1

Una de las herramientas de creación de prototipos GUI más inesperadas es en realidad Keynote. Conozco algunos diseñadores de interfaz de usuario de primer nivel que lo juran, y Keynotopia es un recurso fantástico para usar Keynote de esta manera. Si no hubiera visto que se usara de manera tan efectiva, probablemente no lo habría creído, pero funciona bastante bien. Si estás en una Mac, ¡pruébalo!


0

Estoy trabajando en Pidoco .

Con nuestras herramientas de creación de prototipos puede desarrollar prototipos para el sitio web, la aplicación móvil o el software. Puede simular la maqueta directamente en una computadora de escritorio, un teléfono inteligente o una tableta utilizando la aplicación gratuita Pidoco de AppStore y Google Play .

Las características principales son:

  • Colaboración en tiempo real
  • Exportar a HTML, PDF, Word, PNG, SVG
  • Muchas plantillas
  • Plantillas
  • Plantillas personalizadas
  • SaaS para que pueda usarlo desde cualquier navegador

2
Por favor, no promocione a su empresa en cada pregunta que haga sobre la estructura de alambre. Aunque gracias por ser abierto que eres un empleado allí.
DA01
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.