Entwerfen einer Benutzeroberfläche für Programmierer [geschlossen]

Ich mache UI-Design für eine Gruppe von Programmierern, die an der Entwicklung musikbezogener Software arbeiten. Ich habe .psd-Dateien für alle Mockups, Grafiken usw. erstellt.

Ich ging davon aus, dass sie nur die (vielen) Bilder brauchten, um sie in den Code einzufügen, aber sie wollten, dass ich eine GUI verwende, um den notwendigen Code auszuspucken.

Meine Frage: Gibt es ein GUI-Tool, das SEHR EINZIGARTIGE Designs erstellen und die Mockups im Code mit MatLab oder Java ausspucken kann? -- Oder sollte ich einfach nein sagen und ihnen die Bilder zur Verwendung im Code geben. (wir sprechen hier von Gitarrenpedal-Knöpfen, EQ-Schiebereglern usw.)

Dies ist nicht wirklich eine Frage des Grafikdesigns. Klingt wie eine IDE-Frage. Im Allgemeinen würde ich jedoch selten – wenn überhaupt – einer IDE vertrauen, die den Code basierend auf Mockups „ausspuckt“.
Was sie verlangen, ist absurd, wenn Sie nicht mit dem Verständnis eingestellt wurden, dass Sie die Benutzeroberfläche programmieren würden; dies ist keine gängige Praxis. In Anlehnung an den obigen Kommentar bin ich ein Entwickler und würde niemals GUI-generierten Code verwenden, noch würde ich einen Designer bitten, Code für mich zu erstellen, es sei denn, er wäre ein Entwickler/Designer-Hybrid mit Programmiererfahrung. Wenn sie ein interaktives Mockup wollen, versuchen Sie es mit einem Wireframing-Tool, aber auch hier hätten sie dies im Voraus angeben sollen, da es etwas über die standardmäßige Designer-Pflicht hinausgeht. Klingt, als wären sie es nicht gewohnt, mit Designern zusammenzuarbeiten?

Antworten (1)

Es gibt keinen universellen Weg, eine Benutzeroberfläche zu beschreiben. Es ist typisch für einen Designer, Bild-Assets als eines oder eine Kombination dieser Dinge zu übergeben:

  • Einzelne Dateien. Wahrscheinlich 32-Bit-PNGs, wenn Sie eine iOS-, Android- oder Mac-App erstellen.
  • Sprite-Blätter. Häufiger für Spiele als für Apps. Spritesheets werden auch als Texturatlanten bezeichnet.
  • Photoshop-Dokumente (PSD). Manchmal ziehen Entwickler es vor, die Dinge selbst zu zerschneiden, damit sie mit verschiedenen Möglichkeiten experimentieren können, die Benutzeroberfläche im Code zu implementieren.
  • Einige Informationen, die die Nicht-Bild-Aspekte des Designs beschreiben. Textgröße und -farbe etc.

Ist das Ziel das endgültige Produktionsvermögen? Wenn dies der Fall ist, besteht die Möglichkeit, dass der Entwickler die oben beschriebenen Dinge haben möchte (oder sollte). Wenn Sie nur Modelle erstellen, um zu demonstrieren, wie die App funktioniert, gibt es viele Ansätze, einschließlich der Verwendung von HTML/CSS, der Keynote-App von Apple. Grundsätzlich alles, was zeigen kann, wie sich die App bewegt und zusammenpasst.

Letztendlich liegt die Entscheidung, wie das UI konstruiert wird, beim Entwickler. Selbst wenn es sich um eine iOS-App handelt, bei der die IDE ziemlich gesperrt ist, gibt es immer noch viele Möglichkeiten, sich der Codeseite zu nähern (XIBs, Auto-Layout, alles im Code erledigen).