Designen Killer Apps für mobile Shopper | Beckii Adel | Skillshare

Playback-Geschwindigkeit


  • 0.5x
  • 1x (normal)
  • 1.25x
  • 1.5x
  • 2x

Designen Killer Apps für mobile Shopper

teacher avatar Beckii Adel, Designer

Schau dir diesen Kurs und Tausende anderer Kurse an

Erhalte unbegrenzten Zugang zu jedem Kurs
Lerne von Branchenführern, Ikonen und erfahrenen Experten
Eine Vielzahl von Themen, wie Illustration, Design, Fotografie, Animation und mehr

Schau dir diesen Kurs und Tausende anderer Kurse an

Erhalte unbegrenzten Zugang zu jedem Kurs
Lerne von Branchenführern, Ikonen und erfahrenen Experten
Eine Vielzahl von Themen, wie Illustration, Design, Fotografie, Animation und mehr

Einheiten dieses Kurses

13 Einheiten (19 Min.)
    • 1. Einführung

      1:17
    • 2. Vorbereitung auf den Kurs

      0:39
    • 3. Erkunden

      0:40
    • 4. Schaffen eines Moodboard

      0:50
    • 5. App Design 101: Best Practices

      2:27
    • 6. UI/UX

      1:06
    • 7. Auflistung der Essentials

      1:27
    • 8. Raue Drahtrahmen skizzieren

      0:48
    • 9. Einrichtung

      1:05
    • 10. Wireframe Iterationen

      1:11
    • 11. Iterationen gestalten

      0:43
    • 12. Fertig!

      0:35
    • 13. Gestalten meiner Everlane App

      5:54
  • --
  • Anfänger-Niveau
  • Fortgeschrittenes Niveau
  • Fortgeschrittenes Niveau
  • Alle Niveaus

Von der Community generiert

Das Niveau wird anhand der mehrheitlichen Meinung der Teilnehmer:innen bestimmt, die diesen Kurs bewertet haben. Bis das Feedback von mindestens 5 Teilnehmer:innen eingegangen ist, wird die Empfehlung der Kursleiter:innen angezeigt.

632

Teilnehmer:innen

5

Projekte

Über diesen Kurs

Beckii Adel, Designer bei Dynamo die digitale Designagentur in Montreal, gibt dir einen detaillierten Blick auf ihren kreativen Prozess beim Design einer App. Ziel des Kurses ist es, die wichtigsten Bildschirme einer E-Commerce-App für die bevorzugte Modemarke des Schülers zu gestalten. Mit den vorhandenen Stilen und Grafiken der Marke erstellen die Schüler mood machen viel UI und UX Recherche, skizzieren rauer Drahtrahmen und iterieren auf ihren Drahtrahmen und Designs bis zur Erstellung ihrer endgültigen Entwürfe.

Triff deine:n Kursleiter:in

Teacher Profile Image

Beckii Adel

Designer

Kursleiter:in

Beckii is Dynamo's resident app designer and she'll tell you that her role isn't just to make interfaces usable, it's to make them highly addictive. Having already worked with quite a few prestigious companies, this unapologetic overachiever joined Dynamo as an intern in 2013 but was swiftly advanced to a permanent position as a designer, and to some, 'lil sister'. Young but fierce, the future is bright for this hot-yoga practicing, Skillsharing, 30 Day Self-Challenging, design ninja firecracker. She may be smiling 24/7, but some of us are convinced that she's secretly plotting to take over the world.

Vollständiges Profil ansehen

Kursbewertungen

Erwartungen erfüllt?
    Voll und ganz!
  • 0%
  • Ja
  • 0%
  • Teils teils
  • 0%
  • Eher nicht
  • 0%
Bewertungsarchiv

Im Oktober 2018 haben wir unser Bewertungssystem aktualisiert, um das Verfahren unserer Feedback-Erhebung zu verbessern. Nachfolgend die Bewertungen, die vor diesem Update verfasst wurden.

Warum lohnt sich eine Mitgliedschaft bei Skillshare?

Nimm an prämierten Skillshare Original-Kursen teil

Jeder Kurs setzt sich aus kurzen Einheiten und praktischen Übungsprojekten zusammen

Mit deiner Mitgliedschaft unterstützt du die Kursleiter:innen bei Skillshare

Lerne von überall aus

Ob auf dem Weg zur Arbeit, zur Uni oder im Flieger - streame oder lade Kurse herunter mit der Skillshare-App und lerne, wo auch immer du möchtest.

Transkripte

1. Einführung: Hi, ich bin Becky Adele. Ich bin Designer bei Dynamo, einer digitalen Designagentur in Montreal, Quebec. Wir entwerfen und bauen Websites und APS für wachsende Unternehmen auf der ganzen Welt, einschließlich Hochglanz eines Käufers reinen Kräuterton und Cry endet Woche nur um nur einige zu nennen. Ich sage meinen Designerfreunden immer, dass es eine App sein muss, wenn es eine Sache gibt, die sie während ihrer kreativen Karriere erstellen müssen. Es ist wie eine ganz neue Welt im Vergleich zu Printer Web, und ich bin total Kopf über Heels in sie verliebt. Hier ist also Ihre Chance, eine eigene App zu entwerfen. Meine Skulpturenklasse heißt Design Killer APS. Für mehr, während Käufer, werden wir die Gestaltung der wichtigsten Bildschirme Oven e Commerce App Für Ihre Lieblings-Modemarke , konzentrieren wir uns auf die Gestaltung von Bildschirmen und Funktionalität, die eine E-Commerce-App einzigartig machen. Die Kategorie des Startbildschirms wird auf dem Bildschirm mit den Produktdetails angezeigt. Wir werden einen eingehenden Blick auf den Prozess der Gestaltung einer App von Anfang bis Ende werfen. Als Student werden Sie Mood Boards erstellen, die Tonnen von Recherchen machen, vier Frames verspotten und auf Ihre eigenen Designs iterieren Mit dieser Erfahrung und meinen Tipps und Tricks, werden Sie in der Lage sein, es auf jede zukünftige APS anzuwenden , die Sie entwerfen werden, also lasst uns loslegen. 2. Vorbereitung auf den Kurs: Zunächst einmal, danke für die Anmeldung meiner Fähigkeit Kurzunterricht. Ich hoffe, es gefällt dir wirklich. Um sich auf diesen Kurs vorzubereiten, müssen Sie einfach eine oder zwei Anwendungen herunterladen, um Ihre Entwürfe persönlich zu erstellen. Ich liebe Adobe Illustrator und werde es für diese Klasse verwenden. Ich kenne auch Designer, die es vorziehen, Wählershop zu verwenden, was auch total cool ist . Sie können eine kostenlose 30-Tage-Testversion aller Adobe-Anwendungen auf ihrer Website herunterladen. Andere Optionen sind Skizze Accenture und Balsamic, alle Anwendungen sind, die entwickelt wurden, um zu verspotten und zu entwerfen Nickerchen. Links zu diesen Websites, um mehr zu erfahren und Donald sie sind im Ressourcenabschnitt der Projektzuordnung aufgeführt . 3. Erkunden: Jetzt ist es an der Zeit, herauszufinden, auf welcher Modemarke Sie Ihre App stützen möchten. Werfen Sie einen Blick in Ihren Schrank. Welche Modemarken lieben, welche E-Commerce-Websites Sie finden sich ständig angezogen um Ihre Marke auszuwählen und die Erkundung beginnen zu lassen? Ich werde meine APP für Everly erstellen. Sie haben qualitativ hochwertige Produkte, die schön gestaltet sind, genau wie ihre Website ISS. Der erste Schritt ist also, sich mit Ihrer gewählten Modemarken Website vertraut zu machen. Also gehen Fenster einkaufen, gehen Sie durch die Website und analysieren Sie den Fluss, den Sie gehen durch von dem Moment, dass Sie auf ihrer Homepage landen , wenn Sie im Begriff sind, klicken. Schauen Sie sich an. Aber nicht, es sei denn, Sie planen einkaufen, anstatt diese Klasse zu tun. 4. Schaffen eines Moodboard: gehen Sie durch Ihre gewählten Modemarken arbeitet ich gründlich ihre Art zu analysieren. Und ich rede nicht nur über die Klamotten. Ich spreche über die Grafik, die Typografie, die Farben, die Texturen, die Knöpfe, die Fotografie, die Ikonographie, das alles, was Schriftarten und Stile tun sie für ihre Titel verwenden? Untertitel. Body Tex und Links Verwenden sie Saw Sarah Fonts? Sarah beides. Wie und wo sind sie Talusaugen oder fett Text? Ich möchte, dass Sie durch die Mode-Website gehen und Bildschirmaufnahmen machen jedes Stück und jeden Stil, den sie mit diesen Screenshots verwenden. Ich möchte, dass Sie ein Stimmungsbrett machen, indem Sie sie alle zusammen auf einer Seite und Illustrator-Foto-Shopper im Design, speichern Sie es als J-Pic und veröffentlicht bis in die Project Gallery. 5. App Design 101: Best Practices: Wenn es darum geht, APS zu entwerfen, gibt es eine ganz neue Reihe von Regeln und Richtlinien, mit denen Sie normalerweise nicht auf anderen Medien umgehen müssen . Daumenreichfähigkeit Wenn Sie Ihr Telefon halten, gibt es zugänglichere und weniger zugängliche Bereiche auf dem Bildschirm. Natürlich ändern sich diese Zonen je nach Größe Ihres Telefons. Wenn Sie also eine App entwerfen, ist es immer gut, dies zu beachten, wenn Sie herausfinden, wo Sie Ihre Tasten platzieren können. Möchten Sie wirklich, dass Ihr Benutzer den oberen Bildschirmrand erreicht? Wiederholte Lee-Tastengröße? Unsere Finger sind größer als die Größe eines Mauszeigers, daher empfiehlt Apple, dass wir alle unsere Tasten oder Kräuterbereiche mindestens 44 x 44 Pixel verknüpfen , damit der Benutzer leicht mit seinen Fingernavigation klicken kann Die oberen und unteren Widerhaken der APP sind die sichersten und saubersten Orte, um Navigationselemente zu setzen, da sie Platz in der Mitte des Bildschirms lässt. Für den tatsächlichen Inhalt, Jedoch, viele APS entfernen die Balken vollständig und haben einfach schwebende Tasten, die in einigen Fällen funktioniert wirklich gut. Ah, sehr empfehlen, dass Sie sich ein paar Minuten Zeit nehmen, um Design-Explosionen zu lesen, Mapping auf IOS, wo Navigationselemente von Google Maps und Apple Maps verglichen werden. Ich habe den Link im Referenzen Abschnitt des Projekts Zuordnung veröffentlicht. Der Hamburger. Der Hamburger ist ein Symbol, das ein Menü darstellt. Es ist ein Symbol war in der Regel drei horizontale Linien, die, wenn angeklickt, zieht eine versteckte Navigation. Diese Funktionalität ist super praktisch auf kleinen Bildschirmen, die nicht genug Platz haben, um viele Schaltflächen oder Symbole in der oberen oder unteren Leiste anzuzeigen. Verwenden Sie den Hamburger nicht wie eine Junk-Schublade. Der Ort, an dem wir Dinge hineinwerfen, um sie zu verstecken. Bitte halten Sie diesen Raum organisiert, und Jeffrey, nur die wichtigsten Links sollten in diesem Menü gehen. Google Material Design Dies ist ein Tier auf eigene Faust, so sind sehr empfehlen, dass Sie durch ihre Richtlinien schauen, um einen eingehenden Einblick in die Analyse von Google ihrer visuellen Sprache zu bekommen . Dies ist auch im Abschnitt „Referenzen“ der Projektzuordnung verknüpft. Im Wesentlichen geht es darum, wie digitale Designs wie ausgereifte Objekte spiegeln und reagieren, wenn ein Benutzer damit interagiert . Es hat auch eine sehr zielgerichtete Grundlage, wo alles über Materialdesign extrem durchdacht wurde , um dem Benutzer ein makelloses visuelles Erlebnis zu bieten. 6. UI/UX: Forschung, Forschung und Forschung etwas mehr. Während dieser ganzen Klasse werden Sie zwischen Ihrer Arbeit und Forschung hin und her gehen. Ich möchte, dass du Pinterest und die anderen Websites durchgehst, die ich im Referenzen Abschnitt der Projektaufgabe aufgeführt habe . Zuerst, suchen Sie nach bestimmten Sie ich Beispiele, die Sie für Ihren Home-Bildschirm Ihrer App inspirieren könnte. Achten Sie auf die Layouts und den Inhalt der Bildschirme. Einige Karten haben möglicherweise auf Leah-Navigation auf ihrem Startbildschirm, während andere direkt Produkte haben. Analysieren Sie, welche Möglichkeiten es für Europa gibt. auch Halten SieauchAusschau nach UX-Beispielen, die Sie von uns mögen. Ich meine die Interaktivität. Wenn Sie auf ein Foto oder einen Button klicken, was passiert auch, wie integrieren Sie das Materialdesign in Ihre App? Speichern Sie Ihre Lieblingsbilder in einem Ordner auf Ihrem Desktop und forschen Sie dann weiter nach der Kategorieanzeige und den Produktdetail-Bildschirmen, wenn Sie fertig sind, erstellen Sie eine Forschungsseite für jeden Bildschirm und posten Sie sie als J. Pays auf die Projekt-Galerie, damit ich Ihren Fortschritt sehen konnte 7. Auflistung der Essentials: Seien wir ehrlich, das Internet ist ein großer und potenziell beängstigender Ort. Überall gibt es viele Informationen. Unser Drop ist ein Designer, um die bestmögliche Benutzererfahrung zu vereinfachen und gleichzeitig unsere Kunden glücklich zu machen. In diesem Fall möchten wir, dass Benutzer zu zahlenden Kunden konvertieren, also konzentrieren wir uns streng auf den E-Commerce. Beginnen wir mit dem Home-Bildschirm, öffnen Sie Ihre Modemarken Website und notieren Sie sich, was aufgenommen werden muss. In meinem Fall. Ever Lean braucht ein Logo, Einkaufstasche, Navigation und Kategorie namens Aktionen oder C T A s für Kategorieanzeige. Was muss einbezogen werden? Für immer gelegt. Ich muss die Navigation Warenkorb Abschnitt Titel, Produktbilder mit ihren Namen, Preis und Farbe. Abhängig von Ihrer Website benötigen Sie möglicherweise sogar eine Such- oder Filterfunktion. Jede Spur enthält keine in ihrem Zustand, also werde ich bei dem bleiben, was sie vorerst haben. Für Produktdetails, Screen, was für alles, was wir brauchen, enthalten sein muss. Ein Hauptbild mit zusätzlichen Fotos. Produktname Preis mit einer Aufschlüsselung, Farboptionen im Dropdown-Menü. Seufzer Auswahl an einem Beutelknopf und dann Details über das Produkt selbst. Aber die Stil-Größe und sie fühlen sich über die Fabrik 8. Raue Drahtrahmen skizzieren: erinnerst du dich, als wir alle recherchierten für jeden der Schlüsselbildschirme? Nun, das wird überaus nützlich werden. Schnapp dir einen Bleistift und Papier, und ich möchte, dass du mit der Liste, die du gerade gemacht hast, ein paar Kriegsrahmen für dich kreierst . Ich möchte, dass Sie durch jedes der Screenrecherche-Beispiele, die Sie gefunden haben, gehen und sehen, wie andere Handlungen jedes der wesentlichen Elemente enthalten haben. beispielsweise Wie zeigen andere APSbeispielsweisedie Kategorie an? C. T befindet sich auf dem Startbildschirm? Wo werden sie aufgestellt? Finden Sie die beste Lösung für Ihre gewählte Marke und verspotten Sie sie grob auf Papier, um eine Vorstellung von Größe und Platzierung für alle wichtigen Elemente zu erhalten , die Sie aufgelistet haben. Das wird uns helfen, wenn wir tatsächlich anfangen zu entwerfen. Posten Sie Ihre Drahtrahmen in die Projekt-Galerie, damit ich Ihren Fortschritt sehen kann. 9. Einrichtung: jetzt, da wir einige grobe Drahtrahmen haben, Organ auf ihnen iterieren. Alles wird auf der Bühne zusammenkommen, also stellen Sie sicher, dass Sie Ihre Moodboard Forschungsbeispiele und Drahtrahmen fertig und in der Nähe haben . Während dieser Lektion. Öffnen Sie Ihre Software Ihrer Wahl und erstellen Sie eine neue Leinwand, die 750 x 1003 134 Pixel für ein iPhone misst . Sechs App. Wenn du kein Apple-Fan bist, dir keine Sorgen. Gestalten Sie Ihre App auf einem Mobilgerät Ihrer Wahl, pausiert Video und nehmen Sie sich einen Moment Zeit, um Ihren groben Drahtrahmen digital neu zu erstellen. Als nächstes öffnen Sie Ihre Modemarken Website und lassen Sie uns herausfinden, welche Sponsor mit unserer Hervorhebung einen Abschnitt ihres Textes. Klicken Sie mit der rechten Maustaste, und wählen Sie Elemente prüfen. Wenn Ihre Marke mehr als einen Spaß verwendet, stellen Sie sicher, dass Sie dies für alle Haupttypen tun, die jemals Laden sowohl eine Serif als auch eine Untertasse verwendet . Wenn ja, durch die Verwendung des Inspect-Element-Tools, konnte ich sehen, dass sie Jahrhundert Schulbuch eine Antenne verwenden. Zum Glück habe ich diese beiden Stürme, damit ich sie in meinen Mock Ups benutzen kann. Wenn Sie nicht über die Schriftarten verfügen, die Ihre gewählte Marke verwendet, können Sie eine ähnliche Schriftart von Google Fonts oder Font Eichhörnchen dot com herunterladen 10. Wireframe Iterationen: Schauen wir uns einen Drahtrahmen an und analysiert, wie ausgewogen oder unausgewogen dort. In meinem Fall hat der Produktdetailbildschirm die meisten Inhalte und benötigt die größte Menge an Struktur, um es nicht nur intuitiv für den Benutzer, sondern auch optisch ansprechend und meinen groben Drahtrahmen zu machen . Ich habe für jedes meiner wesentlichen Elemente etwas Einfaches und Einfaches verspottet, aber ich bin damit nicht ganz zufrieden. Ich habe Probleme damit, wo man den Preis setzt, wie man die Farb- und Größenoptionen anzeigt, wo und wie man die Preisaufschlüsselung anzeigt. Und selbst wenn einer der drei Detailabschnitte im zusammenklappbaren Bereich versteckt werden sollte oder sollte , durch sie Belüftung, werden Sie in der Lage sein, verschiedene Optionen auszuprobieren, und ich empfehle dringend, dass Sie sich auf Ihre Forschungsbeispiele. Wenn Sie keine guten Beispiele für einen bestimmten Fall haben, seien Sie nicht schüchtern, mehr zu recherchieren. Wenn überhaupt, wird es zu Ihrem Vorteil sein, die zusätzliche Arbeit zu erledigen. Um meinen Erstellungsprozess zu vereinfachen. Ich mag es, meine Leinwand zu duplizieren, um an meinen Iterationen zu arbeiten. Auf diese Weise konnte ich sehen, was funktioniert und was nicht funktioniert. Es ist auch eine gute Möglichkeit, zurücktreten zu können und zu sehen, wie weit ich für meinen ersten Markup Post Ihren besten Drahtrahmen gekommen bin . Es handelt sich um die Projekt-Galerie, so dass ich Ihren Fortschritt sehen konnte. 11. Iterationen gestalten: Jetzt, da wir einen soliden Leo haben, können wir anfangen, die Persönlichkeit der Marke hinzuzufügen. Und schließlich die Drahtrahmen zum Leben erwecken. Beginnen Sie langsam durch Ihre Drahtrahmen zu gehen und fügen Sie die Schriftarten hinzu, die die Marke verwendet. Schauen Sie zurück auf Ihr Moodboard und sehen Sie, wie sie dort stylen. Kopfzeilen, Unterkopf, er Körper texanischen Links. Verwenden sie eine Variation von Typengrößen und -gewichten? Integrieren Sie diese Stile und Ihre Drahtrahmen. Probieren Sie eine ganze Reihe von Optionen durch Maurin aus und sehen Sie, welche die Marke widerspiegeln . Bester Start. Ich habe in der Bryans-Fotografie nicht in die Platzhalterfelder aufgenommen und die Farben der Marke hinzugefügt . Sobald Sie fertig sind, könnten alle, die die zusätzliche Meile gehen und sogar mit den Interaktionen verspotten, so aussehen, als ob Sie das Dropdown-Navigationsmenü oder den Einkaufswagen entwerfen . Viel Spaß damit. 12. Fertig!: und das ist ein Wrap. Vielen Dank für die Teilnahme an meiner Skill-Share-Klasse. Ich hoffe wirklich, dass wir hinter den Kulissen einen Blick in meinen Schöpfungsprozess werfen, dass Sie das Gelernte auf zukünftige Acts anwenden können, die Sie entwerfen werden. Ich freue mich auf Ihre endgültigen Projekte und bitte stellen Sie sicher, dass Sie Ihren gesamten Prozess einbeziehen, einschließlich Ihrer Moodboards, Forschungsbeispiele, groben Drahtrahmen und Ihre besten Drahtrahmen und Design-Iterationen. Je mehr ich sehen kann, desto besser kann ich Ihnen eine volle Kritik geben, also nochmals vielen Dank, und ich hoffe, Sie haben es genossen. 13. Gestalten meiner Everlane App: Ich liebe es immer, zu sehen, wie andere Leute ihre Projekte von Anfang bis Ende erstellen. Also werde ich euch hinter die Kulissen aufgeben. Schau dir an, wie ich meine jemals Lane nach oben entworfen habe, wenn ich ein Moodboard für eine bestehende Marke mache. Ich mag es, durch ihre Website zu gehen und Screenshots von jeder Art von grafischen und grafischen Elementen zu machen . Auf diese Weise habe ich ein physikalisches Beispiel dafür, wie ihre Marke online visuell dargestellt wird. Ich platziere alle Screenshots in keiner bestimmten Reihenfolge auf einer Leinwand, und damit habe ich das Gefühl, dass ich ein ziemlich gutes Verständnis dafür habe, wie die Marke aussieht und sich anfühlt. Als ich in der High School war, hatte ich eine technische während des Unterrichts, wo ich ein Super-Nerd war und einen Pluspunkt bekam und sogar die Hausaufgaben des anderen Schülers machte . An diesem Punkt, meinem Leben, habe ich tatsächlich in Erwägung gezogen, Architekt zu werden. Es ist verrückt zu denken, dass ich jetzt etwas in der gleichen Linie mache. Aber für Websites und APS sieht das Skizzieren von Drahtrahmen super langweilig und sinnlos aus. Aber sie sind so hilfsbereit. Es ist eine einfache und einfache Möglichkeit, anzuzeigen und zu verstehen, wie die App strukturiert wird, bevor knietief ins Design kommen. Meine Freunde sind genau das, wie sie klingen. Verdrahtete Rahmen. Alle Elemente sind aus Linien gefertigt und enthalten absolut kein Design. Wenn Sie wissen, was die wesentlichen Elemente sind, konfigurieren Sie es, wo jedes Stück gehen muss. Wenn Sie jemals zweitens die Platzierung von etwas erraten, gehen Sie einige Recherchen und sehen Sie, wie andere APS es tun, während Sie die Best Practices , die ich in einer früheren Lektion erwähnt habe, im Auge behalten . Der größte Fehler, dass jeder machen kann, während ihr Design bei ist zu versuchen, alles in einem Bildschirm zu passen , was irgendwie wie die oben die Falte Mythos für Web Menschen Scrollen vor allem auf mobilen Geräten, Also nehmen so viel Platz wie Sie brauchen. Und zerquetschen Sie nicht all Ihre Inhalte, wenn es um Essen auf meinen Drahtrahmen geht. Ich habe gerade eine ganze Reihe von Optionen ausprobiert, um herauszufinden, was funktioniert. Ich verglich die Marken, bestehende Website-Funktionalität mit meinen Forschungsbeispielen und sehe, wie die Funktionalitäten von Web zu Mobile übersetzen. Versuchen Sie auch, die Funktionalität dessen zu replizieren, was ich in anderen Ops mag, aber für die spezifische Marke, an der ich arbeite. Zum Beispiel, als ich versuchte, Minkow, die immer Spur Website, zuzugeben , zeigt ihre Farb- und Größenoptionen in der APP. Es sah einfach langweilig und komisch aus. Also habe ich etwas recherchiert und festgestellt, dass eine andere App, trotz all ihrer Farben und Größen so zentriert, dachte ich, dass es irgendwie interessant war, also habe ich es verspottet. mich fühlte es sich immer noch seltsam an. Also ging ich zurück und ging ein paar andere Optionen auf, und ich schließlich wieder exportiert die erste Idee und fuhr fort, zu wiederholen und zu verfeinern. Bis ich dies erreicht habe, würde ich normalerweise vorschlagen, dass Sie mindestens 10 Iterationen machen, wenn nicht mehr, bevor Sie ihren Favoriten auswählen und fortfahren. Als ich an der Universität meiner Gewinne war, um uns zu bitten, 30 es orations pro Klasse für Hausaufgaben zu tun . Jetzt recherchiere ich nur noch eine Menge mehr und schränke meine Inspiration sorgfältig ein, damit ich genau weiß, was ich verspotten soll. Gestalten ist der lustige Teil. Ich schaue auf mein Moodboard und sehe, welche Stile Luft verwendet und repliziere sie für die App. Es ist wie ein riesiges Puzzle, sie versuchen herauszufinden, welche Stile funktionieren und wohin sie gehen sollten. Dies ist, wo Erfahrung in jeder Art von Grafik oder visuellem Design nützlich ist. Konsistenz ist der Schlüssel, und nicht zu viele Arten, Stile oder Ablenkungen zu haben, ist es, was Ihr Design sauber und gut aussehen wird. Auf meinem Kategorie-Bildschirm habe ich eine ganze Reihe von Optionen ausprobiert, wie ich das Produkt, den Namen, den Preis und die Farbe anzeigen konnte , indem ich die Stile der Marke hinzufüge. Und noch einmal unter Bezugnahme auf mein Moodboard, konnte ich meinen Favoriten auswählen und dann das vorwärts drücken, indem ich auf die Farb- und Größenoptionen zurückgehe . Ich dachte, da ich ein Drop-Down brauchte, um alle Farben anzuzeigen, dass ich eines der anderen Mock ups verwenden könnte , die ich in den Drahtrahmen gemacht habe. Ich wollte nicht, dass Inhalte ausgeblendet werden, wenn der Abschnitt tatsächlich herunterfallen würde. Also entschied ich mich, alle Inhalte zu pushen, die darunter sind, wenn der Benutzer damit interagiert. Also hier sind meine endgültigen Entwürfe für meinen Home-Bildschirm. Ich wollte die Dinge einfach halten und sicherstellen, dass alle wesentlichen Elemente enthalten, die das Logo, die Navigation Einkaufstasche und die Kategorie CTS waren . Für meine Kategorie-Anzeige habe ich ein Banner-Bild enthalten, das nicht wesentliches Element war, aber ich fühlte mich, als hätte es dem Gesamtdesign darunter hinzugefügt. Ich habe Abschnittstitel und dann die Produktbilder mit dem Produktnamen, Preis und Farbe eingeschlossen . Während meiner Recherche stieß ich auf Instagrams UX und mochte wirklich, wie. Wenn Sie den Feed durchlaufen, bleibt der Benutzername oben auf dem Bildschirm, bis der nächste Benutzername ihn ersetzt. Ich dachte, dies würde helfen, das allgemeine u Y und u ex meiner App zu verbessern. Also habe ich mich damit verspottet, könnte funktional wie auf einer separaten Leinwand aussehen, meine Produktanzeige Seiten gefüllt mit Inhalten. Dennoch habe ich versucht, es so einfach wie möglich zu halten, damit der Benutzer nicht allzu abgelenkt oder Inhalten überfordert ist. Indem ich alles abstand, war ich in der Lage, den Bildschirm sauber und organisiert aussehen zu lassen. Alle wesentlichen Elemente sind enthalten, und ich habe sogar den transparenten Preisabschnitt ihrer Produktseite, die ich für ziemlich wichtig hielt, weil es Teil dessen ist, was jemals Spur so einzigartig als Marke macht . Weil ich gerne die Extra-Meile gehe. Ich habe auch mit dem Navigationsmenü markiert würde aussehen, als ob das nicht der Benutzer mit ihm interagiert. Ich stelle sicher, dass Pfeile auf jedem Dropdown-Modul als visuelle Ausbildung für die Benutzer , die in Aktion erforderlich ist, um fortzufahren. Und schließlich das Shoppingbike. Ich habe es super einfach gehalten, indem ich die gleiche Größe Bilder wie die Kategorie-Anzeige verwende und links den Text auf der rechten Seite ausgerichtet habe, wobei ich das Styling des Textes im Auge habe, um es mit den anderen Bildschirmen konsistent zu halten. Als Perfektionist vom Typ B weiß ich, dass es viel mehr für mich gibt, an dem ich weiter arbeiten und verbessern kann. Für mich ist der schwierigste Teil der Versuch, mich auf das zu lenken, was eigentlich verbessert und gearbeitet werden muss . Ich finde es hilfreich, mehr zu recherchieren und zu sehen, wie erfolgreich APS ihre Elemente gestaltet hat . Und damit bin ich in der Lage, zurück zu schauen und EF minus zu analysieren, bis etwas zu trennen oder fehlt. Nachdem ich alle meine Entwürfe fertig gestellt habe, verspotte ich sie gerne innerhalb eines iPhone-Geräts einfach für Anzeigezwecke. Wenn dieser Shop im eigentlichen Design eine echte App zu werden, wurde ich über das Paket ai Datei an den IOS Entwickler geschickt, damit sie bauen können. Aber da dies nur ein persönliches Projekt ist, habe ich gerade getan, um die Anwendungen oder Dienste zu entwerfen und zu verwenden , die mir zur Verfügung stehen. Wenn Sie also möchten, dass Ihr Design lebendiger wird, können Sie es ausprobieren. Sehen Sie sich durch Vorstellungskraft vor. Sie können Ihre Screenshots hochladen und Hotspots hinzufügen, damit Sie damit interagieren können. Sie können sogar ein Symbol hinzufügen und auf Ihr Telefon heruntergeladen, so dass es buchstäblich wie eine echte App aussieht.