Design von iOS Apps im Interface Builder

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • Design von iOS Apps im Interface Builder

    Wollte immer schon mal wissen, wie man am besten seine iOS Apps designed. Wie macht ihr das? Welche zusätzlichen Tools nutzt ihr?
    - Photoshop, Illustrator
    - Sketch
    - oder doch Objective-C/Swift Code

  • Ich denke, so pauschal kann man das nicht sagen. Die von dir genannten Werkzeuge finden alle in bestimmten Bereichen ihre Verwendung, aber es kommt eben auf diesen Bereich an: Das Icon ist ein recht klarer Fall für Photohop etc., einen Button oder so kann aber auch gut im Programmcode gezeichnet werden ( such mal nach PaintCode! ).

  • Osxer schrieb:

    Ich denke, so pauschal kann man das nicht sagen. Die von dir genannten Werkzeuge finden alle in bestimmten Bereichen ihre Verwendung, aber es kommt eben auf diesen Bereich an: Das Icon ist ein recht klarer Fall für Photohop etc., einen Button oder so kann aber auch gut im Programmcode gezeichnet werden ( such mal nach PaintCode! ).

    Das Tool schaut schon mal ganz gut aus. Ich würde mir so etwas wie XAML auch in Objective-C/Swift wünschen.

    ioscampus schrieb:

    Stift und Papier kann ich empfehlen.

    Das benutze ich auch, jedoch muss ich das Design auch irgendwie in die App hineinbringen.
    Wie der Titel schon sagt, suche ein gutes Tool bzw. Ansätze wie man das elegant im Apple Universe lösen kann.
    Mein Wunsch ist es Templates für UI Elemente wie Labels, Button etc. festzulegen und diese in der ganzen App zu nutzen.

    Dieser Beitrag wurde bereits 1 mal editiert, zuletzt von 99s99m ()

  • Ich starte an sich auch immer mit Papier und Stift und zeichne mir die UI grob auf.
    So merkt man schnell wo doch zuwenig Platz ist oder was keinen Sinn macht.

    Danach starte ich normal erstmal in Xcode / Interface Builder und die Navigation und Hintergrundfarben der Hauptviews um.
    Toolbar- und NavigationsItems werden zu dem Zeitpunkt einfach mit TextButtons gelöst, Grafiken kommen erst später ins Spiel.

    Wenn die Datenstruktur der Hauptansichten was einfacheres ist, setze ich auch das schon oft zu dem frühen Zeitpunkt um.
    Ansonsten wird je nachdem was die Haupansicht beinhaltet eben z.B. die Collection oder TableViews mit Nonsens befüllt.

    Ich brauche schon immer recht früh eine funktionierende App um ein Gefühl für die UI zu bekommen.

    Läuft das soweit, mach ich Screenshots der einzelnen "Szenen"/Views und damit geht es dann nach Photoshop.
    Die Buttons (oder was auch immer durch Grafiken ersetzt werden soll) werden mit der Hintergrundfarbe der Views überlagert und ich fange an die späteren Grafiken dafür zu erstellen.
    Das Ganze mache ich lieber in Photoshop mit den Shape-Tools als in Illustrator (Geht mir bei allem was eher UI Design statt Print ist so, zeichne höchstens mal aufwändige Vektorelemente in Illustrator und übernehme die dann nach Photoshop).

    Stehen die Elemente ersetzte ich meist die Screenshots hinter den Grafiken durch eine einheitliche Farbe und versuche Ungereimtheiten auszumerzen (den Grafiken einen einheitlichen Stil zu verpassen).

    Danach hab ich das früher als Grafiken für Retina und Legacy exportiert, seit ein paar Wocchen geht es auch bei mir nach PaintCode damit.
    (Kann PSD Dateien mit Vectorpfaden importieren.)

    Für das meiste verwende ich in Xcode dann die Zeichenroutinen für UIImage die Paintcode erstellt,
    aber auch CAShapeLayer, direkt mit dem UIBezierPath ist einen Blick wert.
    Grafiken drehen oder skalieren ergibt bei VectorShapes natürlich ein viel besseres Ergebnis, als bei Pixelgrafiken.
    Oder wenn es noch wilder sein soll: CAShapeLayer ermöglicht animationen von einem Pfad zu einem anderen, wenn beide die selbe Anzahl Kontrollpunkte besitzen.
    Grafiken lassen sich also verformen / morphen.