Tragbares Designsprech

„Tragbares“ Designsprech

Benjamin Reimold

by Michael Rose @mmistakes

iOS & Android

@elektrojunge

tausendsassaesk.de

benny.reimold@me.com

Benjamin Reimold

Codenauts

codenauts.de

iOS & Android

HockeyAppPS:

Tragbares Designsprech Benjamin Reimold

Mobile Maultaschen

Ping me!

Design (Begriff)

Design (Vorgehensweisen)

Design (Hintergrundwissen)

Design (Praxis)

Apps sind lauwarmer Kaffee!

Appland - das Land der 1000 Kontexte

Apps sind eine ERNSTE Sache

Wir brauchen Designsprech!

Designers to the rescue!

„Spezifikation“ der App

Designerin beauftragen

„tragbares“ Designsprech

alle sind froh

€€€€€€€€

Augenkrebs! NSLog(@“You suck!“);

Die Praxis™ zeigt:

Jede Softwareentwicklerin ist auch Designerin.

Kreativität

Nutzungskontext

Hardware

Ökosysteme

Trends

Subjektivität

Wahrnehmung

Psychologie

Schnellebigkeit

Was ist „Design“ überhaupt?

Psychologie

Werkzeuge / Tools

Ich kann doch nicht „zeichnen“

Erfahrung

Typographie

User Experience

Buzzword-Bingo

Farbenlehre

Know your enemy.

Design (Begriff)

Know your enemy.

Design (Begriff)

Know your enemy.

Design (Begriff)

Know your enemy.

Design (Begriff)

Design (Praxis)

User Experience Design

Interface Design

Interaction Design

Sound Design

Human FactorsHuman-

ComputerInteraction

Information Architecture

Design (Begriff)

Namen sind nur Schall und Rauch.

Apps sind Werkzeuge.

Ein Werkzeug erledigt seinen Job.

Ein Werkzeug lässt sich gut in die Hand nehmen.

Keine Nutzerin juckt, wie es dazu kam.

Details & Überarbeitung

Ideenfindung & Lösungen

Analyse & Strukturierung

Erforschung & Beobachtung

Personas

Mentales Modell

Das mentale Modell

App-Design ist KALTER Kaffee.

seit Mitte der 1970er

Gutes Design ist innovativ.

Gutes Design macht ein Produkt brauchbar.

Gutes Design ist ästethisch.

Gutes Design ist verständlich.

Gutes Design ist unaufdringlich.

Gutes Design ist ehrlich.

Gutes Design ist langlebig.

Gutes Design ist konsequent bis in‘s letzte Detail.

Gutes Design ist umweltfreundlich.

Gutes Design ist so wenig Design wie möglich.

seit Mitte der 1970er

Gutes Design ist innovativ.

Gutes Design macht ein Produkt brauchbar.

Gutes Design ist ästethisch.

Gutes Design ist verständlich.

Gutes Design ist unaufdringlich.

Gutes Design ist ehrlich.

Gutes Design ist langlebig.

Gutes Design ist konsequent bis in‘s letzte Detail.

Gutes Design ist umweltfreundlich.

Gutes Design ist so wenig Design wie möglich.

Dieter

esen für

gutes D

seit ca. 1990

Status

Metapher/Mentales Modell

Freiheit/Kontrolle

Konsistenz/Standards

Fehlervermeidung

Erkennen statt Erinnern

Flexibilität/Effizienz bei der Nutzung

Ästhetik/Minimalismus

Fehlererkennung & Fehlerbehebung

Dokumentation

Nielsen:

10 Usab

ility He

uristi

Wieso ist App-Design dann schwierig non-trivial einfach hart Hexenwerk Teufelszeug

komplex nicht immer einfach?

„Wir haben doch nur Informatik studiert!“

Appland, das Land der 1000 Kontexte

Menschen haben diese...Finger.

Die Wortwolke von vorhin, ihr erinnert euch...

1000 Wege...

Was hilft?

10 Usability Heuristics

Status

Metapher/Mentales Modell

Freiheit/Kontrolle

Konsistenz/Standards

Fehlervermeidung

Erkennen statt Erinnern

Flexibilität/Effizienz bei der Nutzung

Ästhetik/Minimalismus

Fehlererkennung & Fehlerbehebung

Dokumentation

Nielsen:

10 Usab

ility He

uristi

MOAR basic knowledge about „design“!

Skeuomorphismen™

Affordances

Feedback

Feedforward

Direct Manipulation Pattern

Fitts‘s Law

Geschwindigkeit

„Persönlichkeit“

Und noch soooooo vieles mehr...

Design (Praxis)

Guidelines™

1996 (!) Zen of Palm

iOS != Android != Windows Phone != ...

iOS != Android != Windows Phone != ...„So du gestaltest für ein dir

nicht eigen gemachtesBetriebssystem, nutze es vorab

für einige Zeit.“Captain Obvious, 2013

cmd + c / ctrl + c

Was machen „die anderen“?

cmd + c / ctrl + c

Was funktioniert (nicht)?

cmd + c / ctrl + c

Was bringt mir das?

cmd + c / ctrl + c

Was bringt mir das?

cmd + c / ctrl + c mit Stil.

UI-Elemente

Features

Beherrsche dein Werkzeug!

Beherrsche dein Werkzeug!Stift + Papier

Photoshop (Pixelmator/Sketch/...)

UI-Mockup-Tools (Briefsapp, Sketch ...)

„echter“ Prototyp

______________ *

* Schlussstrich™

______________ *

Design (Vorgehensweise)

* Schlussstrich™

______________ *

Design (Vorgehensweise)+

* Schlussstrich™

______________ *

* Schlussstrich™

______________ *

Design (Hintergrundwissen)+

* Schlussstrich™

______________ *

Design (Praxis)

* Schlussstrich™

______________ *

Design (Praxis)=

* Schlussstrich™

______________ *

Design (Praxis)=

Tragbares Designsprech

* Schlussstrich™

Fin. *

* Merci.

Tragbares Designsprech

Technology

ISA UV/Vis Spektrometer System - go-sys.de · welches als tragbares, batteriebetriebenes System für einen unabhängigen Einsatz direkt vor Ort konzipiert ist. Die ISA Modulvarianten

Shader-Sonnenschutz€¦ · Shader-Sonnenschutz Allgemeine Information: Der Shader-Sonnenschutz ist ein kompaktes, tragbares Sonnenschutz - gerät, das unser Gesicht schützt, während

Tragbares Stereo DAB+/UKW- Radio-Gerät DAB 10Scdn.billiger.com/dynimg/tRCD9dnQMsyX90aFpmTDmHt4H9... · 2021. 1. 14. · Gebrauch Ihres Radios, im folgenden Anlage oder Gerät genannt

N17 tragbares Laptopschloss für Dell-Geräte...Lösungen mit den Optionen Master Keyed (K66645EUM), Single Keyed (K66645EUS) und Like Keyed (K66645EUL) • Stahlkabel mit automatischer

Was sind eBooks? Als eBook bezeichnet man ein tragbares elektronisches Lesegerät. Es bietet die Möglichkeit, digitale Publikationen, die als eBook Editions

Technische Information, Proline Prosonic Flow 93T Portable · Proline Prosonic Flow 93T Portable Tragbares Ultraschall-Durchfluss-Messsystem Durchflussmengenmessung von Flüssigkeiten

043-112414-V6 10-14 Romanian - ProControl AMC...Tragbares Mikroskop 043-112414 Caracteristici Tehnice 10/2014 - Specificatiile pot fi modificate fara avertisment Articol: unitatea

Bedienungsanleitung Tragbares Viskosimeter Viscolite d15 ... · BETRIEBSANLEITUNG 3 1 Einleitung Vielen Dank, dass Sie sich für den Kauf eines tragbaren Viskosimeters Viscolite d15

Badger Meter Europa GmbH - ehlersgmbh.com€¦ · UF_DYN_DXN_BA_01_1602 ® Badger Meter Europa GmbH DXN Tragbares Hybrid-Ultraschall-durchflussmessgerät BEDIENUNGSANLEITUNG Februar

Kontakt - Diesnerfunkdiesnerfunk.de/downloads_puplic/Hersteller-Kataloge/Al… · · 2007-11-08Midland G7 - Midland G7 Tarnfarben ... Tragbares Seefunkgerät mit 5 Watt ... Kilometer

Dräger X-am 5600 · 2016. 6. 13. · 5 Verwendungszweck Verwendungszweck Tragbares Gasmessgerät für die kontinuierliche Überwachung der Konzentration meh-rerer Gase in der Umgebungsluft

· BETRIEBSANLEITUNG 3 1. Allgemeine Informationen 1.1 Einleitung Das PCE-RVI 3 ist ein tragbares Viskometer zur schnellen und flexiblen Ermittlung der

MTP850/MTP850 S/MTP850 FuG - TETRA - Tragbares · PDF fileMTP850/MTP850 S/MTP850 FuG TETRA - Tragbares Funkgerät When printed by Motorola Bedienungsanleitung

TECHKON SpectroPlate...sche Präzisionsinstrument genauso souverän wie die Bestim-mung der geometrischen Flächendeckung der Rasterpunkte im CMYK-Vierfarbdruck. Tragbares Mikroskop

Portable Labeler Embosser – Metal Tape Estampeuse ...€¦ · Portable Labeler Embosser – Metal Tape Estampeuse-étiqueteuse portable 3M – Ruban en métal 3M Tragbares Etikettiergerät

JT DMSO2D72JT-DMSO2D72 Tragbares 3-in-1-Gerät Oszilloskop, Signalgenerator and Multimeter 1. ALLGEMEINE INFORMATIONEN Sehr geehrter Kunde, danke, dass Sie sich für unser Produkt

JT DMSO2D72 - Conrad Electronic · 2019-12-16 · JT-DMSO2D72 Tragbares 3-in-1-Gerät Oszilloskop, Signalgenerator and Multimeter 1. ALLGEMEINE INFORMATIONEN Sehr geehrter Kunde,

as rbe lebt - Tragbares Vaterland · 2018. 1. 9. · Traumaexperte Rudolf Ekstein Liebe LeserInnen! Die öffentliche Erinnerung an den Entzug von Menschenrechten und an Menschheitsverbrechen,

HI 96822 Salz-Refraktometer für Meerwasser - aquarent.info · ALLGEMEINE BESCHREIBUNG Das HI 96822 Digital-Refraktometer für Salz ist ein robustes, tragbares und wasser-festes Gerät,

MODERNES TRAGBARES S/W … · Bodymarker >100 mit Angabe der Schallkopfposition Allgemeine Messungen Abstand, Fläche / Umfang, ... Das KUP-101+ ist Ihr zuverlässiger Partner, wo