Funktion vs. Form: Warum ist Design im Code wichtiger denn je?

Seit ich 2014 selbst gelernt habe, wie man Code schreibt, habe ich in meinem Entwicklungsprozess viele Phasen der Verbesserung durchlaufen. Unabhängig davon, ob es sich um die ersten Schritte zum Verständnis rekursiver Algorithmen oder um das erste Projekt handelt, gibt es viele Meilensteine ​​zu erreichen. Keiner dieser Meilensteine ​​hatte jedoch Auswirkungen auf meine Fähigkeit, Projekte zu erstellen.

Beginnen wir mit der Definition des funktionalen Denkens. Funktionelles Denken bedeutet meiner Meinung nach, ganz im Sinne dessen zu denken, was eine Anwendung tut oder möglicherweise tun könnte. Sie beantwortet das Was und Wie. In einem Projekt habe ich zum Beispiel versucht, eine mobile Anwendung für intelligente Kontakte zu entwickeln. Ein Problem, das gelöst werden musste, bestand darin, dass zwei Benutzer Kontaktinformationen (Vcards) mit 1–2 Taps austauschen konnten. Mein anfänglicher Ansatz? NFC (Near-Field-Kommunikation), Bluetooth und QR-Codes nur weil ich könnte. Ich würde wochenlang mit wertvoller Entwicklungszeit verbringen, um Technologien zu erforschen, minimale Prototypen zu entwickeln und zu versuchen, Abhilfemaßnahmen zu treffen, wenn technische Defizite auftreten (alle Augen auf Sie gerichtet, Bluetooth). Das Endergebnis meiner frühen Morgen und späten Abende zu dieser Arbeit? Beeindruckende Funktionen und ein aufgeblähtes, unzusammenhängendes Benutzererlebnis.

Nun zum designorientierten Denken. Designorientiertes Denken ist eine Geisteshaltung, in der Sie darauf bestehen, dass die Anwendung einfach definiert wird und die Erfahrung mit der Anwendung prägnant umrahmt wird. Beim Entwerfen von Problemlösungen müssen Sie nicht nur wissen, wie Sie das Problem lösen. Sie müssen wissen, wie die Lösung für den Endbenutzer aussehen soll. Alternativ können Sie ein Ziel haben, das dem Erstellungsprozess innewohnt, z. B. das Entwickeln einer bestimmten Fähigkeit oder das Erstellen eines beeindruckenden Elements für Ihren Lebenslauf. Unabhängig vom Zweck der Anwendung oder der Erfahrung, die Sie mit designorientiertem Denken vermitteln möchten, können Sie Ihr Ziel erreichen.

Ich begann mich mehr an Design zu orientieren, als ich eng mit einem Designer zusammenarbeitete. Er stellte mich über Bücher und Website-Empfehlungen der Design-Community vor. Nachfolgend finden Sie einige Ressourcen, mit denen ich anfing, wie ein Designer zu denken.

  • www.smashingmagazine.com
    • Design Systems von Alla Kholmatova
    • Inklusive Designmuster von Heydon Pickering
    • Zerschlagenes Buch # 5
    • Das Design alltäglicher Dinge von Don Norman
    • Aus diesen Büchern, Websites und persönlichen Entwicklungsprojekten entwickelte ich den folgenden Rahmen, der die Erstellung von Projekten zu einem lohnenderen Prozess machte, da ich häufig mit meinen Endprodukten zufrieden war.

      1. Welches Problem versuchen Sie zu lösen / das Ziel, das Sie erreichen wollen?

      Bestimmen Sie den Zweck der Anwendung. Dies kann für die Erstellung des Projekts unabdingbar sein (EX: Ich möchte eine Einzelseiten-Webanwendung mit NodeJS, Angular und PostgreSQL entwickeln, um meine Codierfähigkeiten zu verbessern oder darzustellen) oder es kann außerhalb des Kreativ- / Entwicklungsprozesses (EX : Ich möchte eine Aufgabenlisten-App erstellen, mit der ich die Aufgaben verfolgen kann, die ich ausführen möchte.

      2. Welche Funktionen könnten dieses Problem lösen?

      Allgemeines:

      Funktionen lösen einzelne Teile des Problems. Diese Funktionen müssen intuitiv miteinander verknüpft werden, damit der Endbenutzer das Problem lösen kann.

      Strategie:

      1. Warum fragen Sie nach Problemen?

      Beurteilen Sie, warum die aktuelle Vorgehensweise vorhanden ist. Gibt es einen guten Grund dafür, dass die aktuelle Lösung bis zu diesem Punkt erstellt und gewartet wurde? Wenn ja, kennen Sie die Stärken und Schwächen bestehender Lösungen, ob Software, Papierdokumente, manuelle Arbeit usw.

      2. Fragen Sie, was Lösungen sein können

      Was kann zur Behebung der geklärten Probleme anders sein als "Warum fragen"? Wenn Sie feststellen, dass es einen guten Grund gibt, diese neue Lösung auszuprobieren, fahren Sie fort. Wenn nicht, überlegen Sie sich neue Probleme. Vertrauen Sie mir, da draußen gibt es noch viel.

      3. Priorisieren Sie das Merkmal nach Wichtigkeit und Erreichbarkeit

      Allgemeines:

      Jetzt müssen Sie Ihre Funktionen priorisieren, um die Ergebnisse für Ihre Bemühungen zu maximieren. Wenn Sie ein Projekt beginnen, ist es gut, wenn Sie früh gewinnen, um etwas Schwung zu erzeugen. Konzentrieren Sie sich dann auf wichtige und herausfordernde Probleme. Wenn Sie frustriert oder zu lange festgefahren sind, streuen Sie einfachere Aufgaben, um Ihre Bemühungen zu unterstützen.

      Strategie:

      Vollständige Offenlegung: Ich habe dieses System nicht explizit wie unten beschrieben verwendet, sondern habe meine älteren Priorisierungsprozesse im Wesentlichen wie folgt umgesetzt

      Funktionen maximieren:

      1. Erstellen Sie eine Liste aller Funktionen und erstellen Sie dann eine weitere Kopie
        1. Weisen Sie einer Liste Werte zu, sodass die Funktion, die Sie am meisten möchten, oder die einfachste (je nachdem, wie Sie sie einrahmen möchten), 1 (zu den meisten gewünschten) zu n (zu den wenigsten gewünschten) angeordnet wird.
        2. Weisen Sie der anderen Liste Werte zu, so dass die wichtigsten Merkmale mit einer 1 (als wichtigstem Wert) bis n (als dem unwichtigsten) bewertet werden.
        3. Profitieren Sie durchschnittlich von jeder Entwicklungsaufgabe. Bestimmen Sie, welche Features am wichtigsten sind und welche am einfachsten von den Elementen mit den niedrigsten Durchschnitten ausgeführt werden. Auf diese Weise stellen Sie sicher, dass Sie den größtmöglichen Nutzen für den geringsten Arbeitsaufwand erhalten.
        4. 4. Finde ein Mantra

          Sie benötigen eine vereinfachte Methode, um sich an das Gefühl zu erinnern, das Ihre Anwendung erstellen soll. Dies muss einfach genug sein, um einprägsam zu sein, aber spezifisch genug, um Sie zu zwingen, Entscheidungen zu treffen. Dies war nicht meine Kreation, aber leider kann ich mich nicht erinnern, von wem das Buch oder der Artikel zu dieser wichtigen Strategie geführt hat.

          Ich habe dies bei jedem Projekt, das ich seit Anfang 2018 durchgeführt habe, buchstäblich angewendet. Diese Methodik half mir, Entscheidungen für jeden Aspekt der Anwendungen zu treffen.

          Strategie:

          3 Adjektive oder Deskriptoren:

          1. Wählen Sie drei Wörter aus, die beschreiben, wie sich die Anwendung anfühlen soll. Diese Deskriptoren müssen eng an den eigentlichen Zweck der Anwendung gebunden sein.
            1. Für jede Ungewissheit, die Sie bei der Entwicklung des Projekts haben, legen Sie fest, dass die Entscheidung zu einem oder mehreren dieser Deskriptoren beiträgt. Sie möchten, dass jede Entscheidung und jedes Merkmal ihren Beitrag zur Lösung Ihres anvisierten Problems maximiert.
            2. Wiederholen Sie das Nauseum
            3. Nachdem wir den Rahmen erstellt haben, werde ich ein kurzes Beispiel für zwei verschiedene Anwendungsfälle geben:

              Mini-Fallstudie 1: Olivers Table

              Beachten Sie, dass dieses spezielle Thema ausführlich in meinem Artikel über den Font-Kaninchenloch behandelt wurde.

              Zweck: Erstellen Sie eine Vorlagenkonzept-Website für ein Restaurant

              3 Deskriptoren: Frisch, verantwortlich und elegant

              Situation:

              Bei der Auswahl von Schriftarten für diese Vorlage wusste ich, dass ich eine Serifen- und Sansserif-Schrift koppeln wollte. Beim Durchsuchen der kostenlosen Font-Repositories habe ich die serifenlose Schrift Muli gefunden. Durch meine erste Reaktion wusste ich, dass dies die Schriftart war, die ich brauchte.

              Als nächstes musste ich einen Serifenpartner für Muli finden. Ich habe 6 solide Anwärter gefunden, aber keiner von ihnen hat mich so gepackt wie Muli. Also entwickelte ich ein Bewertungssystem für Schriftarten, das Schlaganfall, Proportionalität und Symmetrie berücksichtigt.

              Dies half mir, mich für meine Entscheidungen zu rechtfertigen, und erlaubte mir, das Feld von 6 auf 2 zu beschränken. Dann blieb ich wieder etwas hängen, bis ich zurückschaute und mich an meine Deskriptoren erinnerte: Fresh, Responsible und Elegant. Vor diesem Hintergrund wurde mir klar, dass Muli die Frische und Verantwortlichkeit der Marke stark prägte. Daher musste ich die elegantere der beiden Optionen auswählen. Diese Heuristik lieferte schnell eine Lösung, da ich einen Deskriptor hatte, der eine Repräsentation benötigte.

              Mini-Fallstudie 2: Artollo

              Zweck: Erkunden Sie die Verwendung von Formen und erstellen Sie ein robustes, sauberes Musikermotiv für elektronische Künstler

              3 Deskriptoren: Geeky, Anspruchsvoll, Sauber

              Situation:

              Full Disclaimer, eine Mehrheit der Geekiness in dieser Vorlage stammt von der Kopie, die ich geschrieben habe. Besonders der Musiker Bios;)

              Die Erstellung des einzigartigen „Artollo“ -Stils der IBM Plex Mono-Schriftart beruhte stark auf der Mantrafindung. Dies hielt ein konstantes Tauziehen zwischen den drei Deskriptoren aufrecht. Am Ende habe ich mich für das kursiv geschriebene IBM Plex Mono entschieden, da es durch seine visuelle Einzigartigkeit (Geekiness) die äußerst angenehme und saubere Schriftmenge abrundet.

              Hoffentlich geben diese Mini-Fallstudien Hinweise, wie Sie dieses Framework nutzen können, um die Produktbildung und damit verbundene Frustration zu erleichtern. Wenn Sie mehr darüber erfahren möchten, wie dieses Framework verwendet wurde, sollten Sie unbedingt abonnieren und nach umfassenden Fallstudien Ausschau halten. Darüber hinaus gibt es einen Plan, einen Artikel darüber zu schreiben, wie dieser Entscheidungsrahmen in einer agilen Umgebung funktionieren würde, Scrum usw.

              Ich freue mich darauf, von Ihnen alle in den Kommentaren zu hören und zu hören, wie Sie auch gelernt haben, Projekte zu erstellen!