EIN verspotten oder Mockup ist ein digitales Design einer Website und/oder Anwendung. Mockups werden in der ersten Entwurfsphase verwendet, um Ideen und Konzepte im Kontext des Webdesigns zu visualisieren und die Navigationsstruktur, Website und Designelemente im Detail einzubeziehen. Bei Mockups kann es sich um mit Bildbearbeitungsprogrammen erstellte Vorlagen ohne Funktionalität handeln oder um Designs, die mit speziellen Mockup-Tools erstellt wurden und bei denen Steuerelemente bereits mit einfachen Funktionen verknüpft sind.
Vergleich: Mockup, Wireframe, Prototyp
Die Begriffe „Mockup“, „Wireframe“ und „Prototyp“ werden in der Praxis oft als gleich angesehen, tatsächlich handelt es sich jedoch um drei verschiedene Arten von Designdarstellungen im Rahmen des Rapid Prototyping, die in verschiedenen Phasen des Designs vor der Programmierung verwendet werden. real.
Ein Wireframe ist die einfachste Form einer Vorlage und enthält im Gegensatz zu einem Mockup keine Farben, Typografie, Bilder oder Grafiken. Diese erste Entwurfsskizze kann von Hand oder am PC erstellt werden. Auf diesem Bildschirm fehlt jegliche Funktionalität. Daher gelten Wireframes als Low-Fidelity-Designs. [1]
Mockups können auf jeder bestehenden Struktur aufgebaut und weiterentwickelt werden. Durch die Integration von Farbe, Typografie, Bildern und Grafiken kommen sie dem endgültigen Design sehr nahe und repräsentieren es bereits. Daher sind sie für Präsentationszwecke vorzuziehen.
Ein Modell klassisch ist statisch. Moderne Layout-Tools ermöglichen jedoch die Einbindung einfacher Features wie Links, so dass sie je nach Komplexität als Designs mit mittlerer bis hoher Wiedergabetreue kategorisiert werden können und an Prototypen grenzen.
Als Grundlage für Prototypen können komplexe mehrteilige Mockups dienen, die je nach Stil auch als Medium- bis High-Fidelity-Designs gelten können. Im Gegensatz zum klassischen statischen Modell ist das Prototypen sind immer interaktiv und enthalten die meisten Funktionen der geplanten Webseite oder Anwendung.
Einsatzmöglichkeiten und Vorteile von Mockups
Die Modelle werden in der verwendet Anfangsphase der Website- und App-Entwicklung zur Präsentation und Qualitätskontrolle. Sie dienen dazu, mit dem Kunden die Vorstellungen und Anforderungen der Benutzeroberfläche hinsichtlich Grundfunktionen, Navigation, Inhaltsarchitektur und Design abzustimmen. Wer den endgültigen Vertrag erhält, wird häufig anhand des Modells entschieden.
Für Usability-Tests werden Mockups ohne großen vorherigen Programmieraufwand eingesetzt. Dadurch werden etwaige Probleme bereits vor der Prototypenerstellung erkannt und das Risiko, dass ein Konzept in der Mitte der Entwicklungsphase komplett überarbeitet werden muss, wird verringert. Im Allgemeinen können Mockups Helfen Sie dabei, bei einem Online-Projekt Zeit und Geld zu sparen.
Beispiele
Für Mockups wird manchmal eine einfache Bildbearbeitungs- und Präsentationssoftware wie PowerPoint verwendet, die jedoch im Vergleich zu Mockup-Tools recht langsam ist. Spezialisierte Tools bieten vorgefertigte Elemente und sogar die Möglichkeit, einfache Interaktionsprozesse zu testen.
Beispiele für Website-Mockup-Tools:
Beispiele für Simulationstools für Apps:
Vorteile der Benutzerfreundlichkeit
Da sich Mockups aufgrund ihres mittleren bis hohen Detaillierungsgrades sehr gut für Usability-Tests eignen, ist dies möglich Informationen bereitstellen wichtig für die Benutzererfahrung und helfen dabei, das Benutzererfahrungsdesign schon früh in der Entwurfsphase optimal zu nutzen, insbesondere in den Bereichen Ästhetik und Benutzerfreundlichkeit.
Web-Links
