Welche Software eignet sich am besten für das GUI-Design?

Ich habe Photoshop ausgiebig verwendet, aber Tatsache ist, dass es sich um ein Fotobearbeitungswerkzeug handelt. Es hat einige komplizierte Effekte eingebaut, wie Schlagschatten und inneres und äußeres Leuchten usw., aber es reicht einfach nicht aus, wenn man eine grafische Oberfläche entwirft. Sie können beispielsweise nicht mehrere bearbeitbare Farbverläufe hinzufügen. Und Sie müssen die Werkzeuge dazu bringen, den gewünschten Effekt zu erzielen, obwohl sie dafür nicht entwickelt wurden.

Ich habe auch angefangen, Fireworks zu verwenden, und es gibt ein paar Dinge, die ich mag, wie zum Beispiel die Möglichkeit, die Kurven auf einem abgerundeten Rechteck ständig zu ändern, aber der Farbwähler in diesem Programm ist einfach nicht verwendbar. Wenn Sie in den Mac-Farbwähler gehen, sagt er, dass die Farbe etwas anders ist als sie, weil Fireworks Farbprofile nicht richtig verarbeitet. Dies macht das Anpassen von Farben zu einem sehr schwierigen Prozess. Und die Software insgesamt fühlt sich wie eine Vorabversion an (und sollte es vielleicht auch sein).

Ich frage mich also, welche Software jeder zum Erstellen einer GUI empfehlen würde? Es muss eine Software da draußen geben, mit der Sie eine Reihe von bearbeitbaren Effekten haben können, die Sie jederzeit ändern, in der Reihenfolge ändern und verschieben können, zusammen mit all den anderen Tools, die zum Erstellen großartiger Grafiken erforderlich sind.

Basierend auf all den Antworten hier brauchen wir Sie, um die Frage zu klären. Ich glaube, Sie fragen nach Software, um die eigentlichen GUI-Elemente zu erstellen ... Symbole, Schaltflächen usw. Oder fragen Sie nach Wireframing?

Antworten (5)

Es gibt keine universelle "beste" Software für das GUI-Design. Es hängt nur von Ihren Software-/Workflow-Präferenzen ab.

Photoshop

Ich bin mir nicht sicher, was Sie mit "mehrere bearbeitbare Farbverläufe" meinen, aber wenn Sie wissen, was Sie tun, bietet Photoshop alle Werkzeuge, die Sie zum Entwerfen jeder erdenklichen GUI benötigen. Kein "Austricksen" von Werkzeugen erforderlich.

Trotz seines Namens hat sich Photoshop weit über ein einfaches Fotobearbeitungs-/Manipulationstool hinaus entwickelt, und es gibt keinen Grund, warum Sie darin kein GUI-Design durchführen können. Photoshop bietet wahrscheinlich die umfassendste Reihe von Rasterbildbearbeitungswerkzeugen aller Grafikprogramme auf dem Markt und wird für alles verwendet, von digitaler Malerei über Comicbuchfärbung bis hin zu Illustrationen, Web- und UI-Designs, Videoproduktionen und der Erstellung von 3D-Spielkunst bis hin zu Fotos Forensik.

Funktionen wie Anpassungsmasken, Ebenenstile, Vektorpfade, intelligente Objekte, Ebenenkompositionen usw. machen es zu einer natürlichen Wahl für das UI-Design für diejenigen, die bereits mit seiner Benutzeroberfläche und seinem umfangreichen Funktionsumfang vertraut sind. Ein weiterer Pluspunkt ist, dass es gut in Tools wie Illustrator, Flash Catalyst und viele Apps/Plug-ins von Drittanbietern integriert ist.

Feuerwerk

Viele Leute bevorzugen Fireworks für das Webdesign, da es speziell dafür entwickelt wurde, und aus diesem Grund ist es auch ein gutes Werkzeug für das GUI-Design. Da Fireworks objektorientiert ist und Seiten, Symbole und Stile unterstützt, eignet es sich sehr gut für einen UX-Design-Workflow. Viele Leute finden auch, dass Fireworks ihnen eine bessere pixelgenaue Kontrolle gibt, ohne auf Lineale, Hilfslinien oder Messwerkzeuge zurückgreifen zu müssen.

Darüber hinaus bietet Fireworks viele nette Funktionen wie Verlaufsdithering, ASE-Farbfelder und in gewisser Weise eine bessere Typografiekontrolle als Photoshop. Der Web-Layer von Fireworks und seine Integration mit Device Central von Adobe erleichtern außerdem die schnelle Erstellung von Prototypen für mehrere Geräte.

Illustrator

Eine weitere beliebte App unter UX-Designern ist Illustrator, das viele Stärken mit Fireworks teilt. Wie Fireworks unterstützt es Symbole, erweiterte Objektstile, mehrere Zeichenflächen (ähnlich wie Seiten) und noch bessere Vektorbearbeitungsfunktionen.

Photoshop, Fireworks, Illustrator sowie InDesign haben alle Wireframe-/Schablonen-Kits und UX-Vorlagen für sie im Web verfügbar, aber modulares UX-Design ist in Illustrator und Fireworks einfacher, da sie wiederverwendbare Symbolbibliotheken unterstützen.

Illustrator unterstützt auch Zeichen- und Absatzstile, wodurch seine Typografie-Designfunktionen Photoshop oder Fireworks weit überlegen sind. Darüber hinaus eignet sich Illustrator hervorragend für Illustrationen, sodass alle Symbole oder Webgrafiken, die Sie möglicherweise erstellen möchten, im selben Programm erstellt werden können.

InDesign

InDesign ist eine weitere sehr beliebte App unter IAs, IxDs usw. Ihre Grafikdesign-Funktionen mögen begrenzt sein, aber ihre Unterstützung für Seiten, Absatz- und Zeichenstile, Snippets und Objektbibliotheken macht sie ideal für viele UX-Designaufgaben. InDesign verfügt außerdem über sehr fortschrittliche Satzfunktionen und unterstützt Rasterlayouts. Dies, zusammen mit der InCopy-Integration und der Adobe Digital Publishing Suite, macht es zu einer natürlichen Wahl für Druckmedienunternehmen, die mobile Apps für ihre Zeitschriften entwerfen möchten.


Aber am Ende des Tages hat jedes Tool seine Stärken und seine Schwächen. Die meisten UX-spezifischen Apps wie Axure, Balsamiq, OmniGraffle usw. haben viele großartige UX-spezifische Funktionen für Layout/Wireframe/Interaktionsdesign. Aber am Ende des Tages müssen Sie immer noch die Grafiken für die Benutzeroberfläche entwerfen, wofür Grafikdesign-Tools wie Photoshop/Fireworks/Illustrator benötigt werden.

Aus diesem Grund umfassen die meisten UI-Design-Workflows mehr als eine App. Wenn Sie sich also nicht nur mit einem einzelnen Teil des UI-Designprozesses befassen, z. B. Wireframing oder Erstellen der UX-Bibliothek oder Prototyping, dann wird es keine einzige „beste Software“ geben.

Pencil ist ein kleines und einfach zu bedienendes GUI-Designtool.

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...

Geben Sie hier die Bildbeschreibung ein

Es ist ein nettes Wireframing-Tool, aber ich denke, das OP hat nach einem Grafikbearbeitungstool gesucht.

Wo ich arbeite, verwenden wir Indesign. Wir neigen dazu, saubere, rasterbasierte Layouts mit sorgfältigen typografischen Stilen zu erstellen, und für diese ist Indesign großartig. Es hat eine feine Kontrolle über Zeichen-, Absatz- und Objektstile, was sich gut in CSS übersetzen lässt und eine Feinabstimmung dieser Elemente an jedem Punkt des Prozesses sowie ein kohärenteres Layout ermöglicht. Es ist nicht so toll, wenn man grafische Elemente exportiert, aber wir finden, dass sich der Kompromiss lohnt.

Eines der unerwartetsten GUI-Prototyping-Tools ist eigentlich Keynote. Ich kenne einige erstklassige UI-Designer, die darauf schwören, und Keynotopia ist eine fantastische Ressource, um Keynote auf diese Weise zu verwenden. Wenn ich nicht gesehen hätte, wie es so effektiv eingesetzt wird, hätte ich es wahrscheinlich nicht geglaubt, aber es funktioniert ziemlich gut. Wenn Sie einen Mac verwenden, probieren Sie es aus!

Ich arbeite bei Pidoco .

Mit unseren Prototyping-Tools können Sie Prototypen für Website, mobile App oder Software entwickeln. Mit der kostenlosen Pidoco App aus dem AppStore und von Google Play können Sie das Mockup direkt auf einem Desktop, Smartphone oder Tablet simulieren .

Hauptmerkmale sind:

  • Zusammenarbeit in Echtzeit
  • Export nach HTML, PDF, Word, PNG, SVG
  • Viele Schablonen
  • Vorlagen
  • Benutzerdefinierte Schablonen
  • SaaS, sodass Sie es von jedem Browser aus verwenden können
Bitte werben Sie nicht bei jeder Frage zum Thema Wireframing für Ihr Unternehmen. Trotzdem danke, dass Sie offen sind, dass Sie dort Angestellter sind.