Wireframes und Co.: Conceptual Design als elementarer Projektbaustein, Notizen

Post on 18-Dec-2014

452 views 1 download

description

Wireframes und Co. von Andreas Demmer am 6. Juli 2009 beim 1. Webmontag.talk in Manhheim, Blog: http://www.andreas-demmer.de/weblog/beitrag330/

Transcript of Wireframes und Co.: Conceptual Design als elementarer Projektbaustein, Notizen

1

ANDREAS DEMMERTechnical Director · BARTENBACH AG

Vorstellung Technischer Leiter der BARTENBACH AG 360 Grad Werbeagentur in Mainz beschäftigt 100 Mitarbeiter

2

WIREFRAMES & CO.Conceptual Design als Projektbaustein

Thema nennen Dauer des Vortrags: 10-15 Minuten

3

Auftrag des Vortrags: Verbesserung von Websites und -anwendungen

Learn from the best: Um gute Websites zu bauen, sollte man die anschauen, die erfolgreich sind

4

EINE TYPISCHEGOOGLE-APPLIKATION

Google ist der Inbegriff von Erfolg

Reduktion auf das Wesentliche Einfache Bedienung schnörkellos

5

SUCHE

6

EINE TYPISCHESAPPLE-PRODUKT

Auch Apple ist sehr erfolgreicher Player am Markt

7

TOUCH

wieder: aufgeräumt strukturiert Reduktion aufs Wesentliche

8

EINE TYPISCHEDURCHSCHNITTS-

APPLIKATION

Leider sieht Gros der Anwendungen anders aus

9

völlig überfrachtetunübersichtlichFunktionen die keiner braucht oder versteht

Wie kann es dazu kommen?

10

DAS PROBLEM(und es trifft uns alle)

Die Erklärung dieses Problems Problem tritt uns alle Jeder hat es wahrscheinlich schon erlebt

Auftrag: Mach eine einfache Such-Applikation

11

Anfangs noch schlicht und funktional Doch dann: Logo dazu, Menü für Unterseiten Danach: Ergebnisliste, Breadcrumb, TagCloud Und noch mehr Suchfunktionen, erklärender Text Dann: Neue Navi, WYSIWYG, Stats, Ergebnisfilter Da es kompliziert wird: Hilfefunktionen, viele! Um den Whitespace zu füllen: Weitere Funktionen

mehr und mehr

12

FEATURE-INFLATION

Das Resultat: Viele Features, die keiner brauchtKernfeatures treten in den Hintergrund

13

CHAOS!

Anwendung sieht aus, als hätte eine Bombe eingeschlagen

Unordentlich, überfrachtet Man nutzt solche Seiten nicht gerne

14

DIE LÖSUNGDER LÖSUNGSANSATZ

Die Lösung, dem vorzubeugen gibt es nicht Es gibt kein 100% sicheres Mittel → Lösung zu

vollmundig Eher Lösungsansatz

15

CONCEPTUAL DESIGNER

Der Beruf des Conceptual Designers, auch: Informationsarchitekt Planner Konzepter, Konzeptioner

strukturiert Projekt im Vorfeld plant Umfang, Features und Interface

16

1 2 3 4KONZEPT DESIGN CODEIDEE

An welcher Stelle im Projektverlauf tritt er auf? 4 Projektphasen Kreative Leitidee, also noch vorm „loslegen“ Konzept und Planung → Conceptual Designer Design und Text programmiertechnische Umsetzung

17

KONZEPT DESIGN CODEIDEE

Conceptual Design betrifft (nicht nur) das Konzept

18

INFORMATIONSARCHITEKTUR USABILITY

USEREXPERIENCE

USER CENTERED DESIGN

Die 3 Säulen des Conceptual Design

Informationsarchitektur: Informationen für Zielgruppen gliedern und aufbereiten

Usability: Möglichst intuitive und einfache Bedienung ermöglichen

User Experience: Wie verhält sich das UI während der Bedienung?

Diese Säulen tragen das User Centered Design

19

DER MENSCH IMMITTELPUNKT

Der Mensch steht immer im Mittelpunkt! Immer im Hinblick auf die Nutzer arbeiten D.h. Auch: Funktionen weglassen, die keiner braucht

oder versteht Nichts implementieren, nur weil es cool wäre oder

einfach zu realisieren ist

20

USE CASESPERSONAS

STORY-BOARD

RESEARCH

WIRE-FRAMES

SITEMAP

6 Werkzeuge der Conceptual Desinger Research: Statistiken wälzen, Feldforschung Personas: verschiedene typische Nutzer und deren

Umfeld sowie Bedürfnisse beschreiben Use Cases: Wie würden diese Personen vorgehen

um das Gewünschte zu Erreichen? Storyboard: Wie verhalten sich Funktionen und

Seiten bei der Benutzung? Wie interagiert die Seite?

Wireframes: Welche Funktionen und Inhalte gibt es? Wie sie auf den einzelnen Seiten angeordnet?

Sitemap: Wo sind welche Inhalte in der Hierarchie der Website verortet?

21

Das Ende meines Vortrags ist nah

Ich möchte nur noch ein Fazit ziehen:

22

Erinnern wir uns an die Chaos Applikation vom Anfang und wie diese entstanden ist

Wenn nun kein Aufblähen während Entwicklung, sondern sorgfältige Planung eines Conceptual Designers im Vorfeld:

Dann die Reduktion auf die wesentlichen Kernfeatures und diese einfach benutzbar machen

23

Dann überrascht das Ergebnis vielleicht durch Schlichtheit

Schließen möchte ich Zitat

24

„Probleme kann man niemalsmit der Denkweise lösen,mit der sie entstanden sind.“

– Albert Einstein

Dankeschön!

Eine kurze Sache noch:

25

FOLIEN IM NETZwww.andreas-demmer.de

Folien ab morgen Mittag im Blog meiner Website Mit Anmerkungen

Verlinkung im Web Montag Wiki