Schnittstellendemake – Figma CS2 / Sudo Null IT-News

Hallo alle! Ich bin Produktdesigner in einem kleinen Unternehmen und arbeite dort schon seit geraumer Zeit. In letzter Zeit vermisse ich die Tage, an denen ich etwas zu meinem eigenen Vergnügen entworfen habe, nur zum Spaß. Als ich eines Abends saß, dachte ich, warum nicht? Jetzt trinke ich so was, zum Spaß ehrlicher Leute, hey-gey! Nun, es fing an.

Die Idee kam ziemlich schnell, vor nicht allzu langer Zeit gab es einen Designtrend im Geiste der 90er Jahre, warum also nicht zurück zu den Wurzeln, 2006, als ich meine ersten Schritte im Design machte? Ich möchte zeigen, wie etwas Modisches und Beliebtes aussehen würde, wenn es damals herauskäme.

Die Wahl für mich als Designer wäre offensichtlich – Figma zu nehmen und es irgendwo in den Jahren 2005-2007 als Teil des Adobe-Pakets einzuführen. Können Sie sich vorstellen, was meine Überraschung war, als es eine Woche nach Beginn der Arbeiten an der Benutzeroberfläche Neuigkeiten über den Kauf von Figma durch denselben Adobe gab? Wenn überhaupt, dann nicht wegen mir. Es ist nur ein Zufall. Aber unter einer solchen Kombination von Umständen werden Sie wohl oder übel glauben, dass “das Universum alles hört”.

Und so begann ich damit, zu entscheiden, in welcher Umgebung das alles funktionieren sollte. Natürlich ist dies das heiß geliebte und zu Recht vergessene Windows Vista. Ich gestehe, ich habe noch nie mit diesem System gearbeitet (WXP One Love) und beim Durchstöbern der Screenshots bin ich auf einige Schwierigkeiten gestoßen. Einige Elemente der Benutzeroberfläche unterschieden sich entweder in verschiedenen Versionen oder aus irgendeinem Grund. Es gab sogar eine Idee, es auf eine virtuelle Maschine zu rollen und mit eigenen Augen zu sehen, aber etwas wurde sehr schnell für mich sehr faul (Smiley). Im Allgemeinen entschied ich mich für eine der Versionen und zur Hölle damit. Wenn das Endergebnis nicht von einem Bildschirm aus dem Internet unter anderen Bildschirmen zu unterscheiden ist, können wir sagen, dass dies ein Erfolg ist.

Als erstes habe ich natürlich die Fenster gezeichnet. Übergeordnetes Fenster und untergeordnetes nicht modales Fenster. 2006 war das Hauptwerkzeug des Designers Photoshop CS2, das noch eine MDI-Oberfläche mit vielen kleinen, nicht modalen Fenstern hatte, die über den Bildschirm verstreut waren. Nur in CS3 tauchten Dock-Panels auf und diese Schande wurde aufgeräumt.

Ja, ich habe die Aero Glass-Version nicht gemacht.  Ich kann mir vorstellen, dass es auf meinem damaligen PC funktioniert, und selbst wenn Vista dorthin ginge, würde ich Aero Glass definitiv deaktivieren, weil - Leistung.Ja, ich habe die Aero Glass-Version nicht gemacht. Ich kann mir vorstellen, dass es auf meinem damaligen PC funktioniert, und selbst wenn Vista dorthin ginge, würde ich Aero Glass definitiv deaktivieren, weil – Leistung.

Als nächstes mussten wir ein wichtiges Problem lösen. In Figma wurde jedes neue Dokument in einem neuen Tab geöffnet, aber in PS CS2 war dies nicht der Fall, sondern erschien nur in CS3. Nach einigem Nachdenken entschied ich, dass Figma sich etwas früher etwas Innovation leisten könnte, da es sich um ein Werkzeug zum Entwerfen von Schnittstellen handelt. Glücklicherweise gab es im Internet Explorer 7, der 2006 veröffentlicht wurde, bereits Registerkarten.

Übrigens wurde in der Oberfläche von Windows Vista bereits Segoe UI als Hauptschrift verwendet, mit der wir bis heute bis Windows 11 leben. Es ist nur eine neuere Version.Übrigens wurde in der Oberfläche von Windows Vista bereits Segoe UI als Hauptschrift verwendet, mit der wir bis heute bis Windows 11 leben. Es ist nur eine neuere Version.

In Bezug auf die Registerkarten – in Photoshop waren sie immer noch da, aber nur auf den Symbolleisten. Und ich habe sie auch benutzt.

Ich habe sogar versucht, Schattenartefakte zu rettenIch habe sogar versucht, Schattenartefakte zu retten

Was brauchen wir noch? Speisekarte:

Figma hat jetzt einen Burger, aber es ist kein KanonFigma hat jetzt einen Burger, aber es ist kein Kanon

Schriftrollen:

Paneele und Separatoren:

Und natürlich ein paar Icons:

Ach ja, das Wichtigste! Was brauche ich, um in einem solchen Editor zu zeichnen? Natürlich Userbar!

Und das ist, was ich bekam:

Schneiden für einen detaillierten Look:

Es lohnt sich, ein paar Nuancen zu erwähnen. Erstens bin ich, wie oben erwähnt, etwas faul, also in den Ebenen und im Bedienfeld mit der Elementeinstellung – “Fisch”. Zweitens können die Aufmerksamsten ein falsches Verhalten bemerken, zum Beispiel Roulette hier:

Ja, da sich das linke und das rechte Panel in nicht-modalen Fenstern befinden, sollte das vertikale Lineal hinter dem linken Panel liegen und nicht sichtbar sein, aber damit muss sich der Designer regelmäßig auseinandersetzen – um einen Kompromiss zwischen Ästhetik und Realität zu finden . Ich wollte die Platzierung von Bedienfeldern in Windows nicht aufgeben, um es CS2 ähnlicher zu machen, aber das versteckte Lineal sieht auch so lala aus. Also habe ich für mich entschieden, dass dies auch eine Innovation der Entwickler ist. Sie haben die Fenster an die Seiten des übergeordneten Fensters gekrückt und können nicht verschoben oder in der Größe geändert werden. Fast Dockplatten, nur Fenster.

Das ist alles. Ich hoffe, dass es Ihnen gefallen hat. Das nächste Mal verpacke ich etwas anderes, das Sie täglich verwenden, in „Retro“ oder schleppe im Gegenteil etwas aus dem Guten und Vergessenen in die „Zukunft“.

Danke an alle!

Similar Posts

Leave a Reply

Your email address will not be published. Required fields are marked *