wireframes im interaktionsdesign
DESCRIPTION
http://mprove.de/script/11/wireframes/TRANSCRIPT
![Page 1: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/1.jpg)
Wireframes im Interaktionsdesign – 11.4.2011
Matthias Müller-Prove • User Experience Principal, Oracle
German version
![Page 2: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/2.jpg)
Diverse Titel vonmeinen Visitenkarten
![Page 3: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/3.jpg)
1996 – 2001 GoLive CyberStudio
2002 – 2007 OpenOffice.org
2008 – 2011 Virtual Desktop Infrastructure
![Page 4: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/4.jpg)
http://flickr.com/photos/activeside/2184823461/
Site-Maps
![Page 6: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/6.jpg)
Ski-Was?
http://flickr.com/photos/38451115@N04/5229195968
Ski-Wäs?
![Page 7: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/7.jpg)
Donna Maurer http://slideshare.net/donnam/information-architecture-introduction
![Page 8: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/8.jpg)
Primary Navigation
Content Area
Ads
2nd OrderNavigation
![Page 9: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/9.jpg)
Schematics
Schemazeichnung
Explosionszeichnung
Blaupause
Wireframes
Drahtmodell
Plan
![Page 10: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/10.jpg)
Wireframes sind digitale Schwarzweiß-Zeichnungen.
Wireframes sind schneller und billiger herzustellenals Websites.
Wireframes sind abstrakt und detailliert.
Kommunikation zwischen Designer und KundeKommunikation zwischen Designer und Entwickler
S/W, damit der Kundenicht die Farbgestaltung
kommentiert
![Page 11: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/11.jpg)
<Insert Picture Here>
Desktop Virtualizationmit Oracle VDI
![Page 12: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/12.jpg)
12
http://www.time.com/time/photogallery/0,29307,1930296_1967873,00.html
And now to somethingcompletely different…
![Page 13: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/13.jpg)
13
![Page 14: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/14.jpg)
14
![Page 15: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/15.jpg)
Sun Ray Thin-Client PortfolioSun Ray 3
Sun RayTM 3 Low cost, low power, small footprint
Sun Ray™ 3iAll-in-one client with 21.5" screen
![Page 16: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/16.jpg)
![Page 17: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/17.jpg)
![Page 18: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/18.jpg)
![Page 19: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/19.jpg)
Flexible Desktop Assignments
http://www.designcomics.org/
![Page 20: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/20.jpg)
Flexible Desktop Assignments
TemplateTemplate
flexible assignedlogged in
AvailableDesktop
flexible assignedlogged out
AvailableDesktop
Pool with flexible desktop assignment
AvailableDesktop
Desktop
![Page 21: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/21.jpg)
Personal Desktop Assignments
![Page 22: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/22.jpg)
Personal Desktop Assignments
TemplateTemplate
Nina’sDesktop
Michaelpersonal assigned
logged in
Ninapersonal assigned
logged out
Pool with personal desktop assignment
Michael’sDesktop
![Page 23: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/23.jpg)
<Insert Picture Here>
VDI Administration
![Page 24: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/24.jpg)
![Page 25: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/25.jpg)
![Page 26: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/26.jpg)
<Insert Picture Here>
Der Computer als Medium
ein kurzerphilosophischer
Exkurs
![Page 27: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/27.jpg)
http://flickr.com/photos/mprove/2855242322/
Bill Verplank, BayCHI 2008
Der heilige Grahldes Interaktionsdesign
![Page 29: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/29.jpg)
Ein persönliches dynamisches Mediumflickr.com/photos/ezu/5604927/
![Page 30: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/30.jpg)
Ein »soziales« dynamisches Medium
![Page 31: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/31.jpg)
http://dryicons.com
Ein verteiltesEngineering-Team
für DesktopVirtualization
![Page 32: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/32.jpg)
Wireframing mit OpenOffice.org Impress
via http://www.scaffoldage.com/post/3897615849
![Page 33: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/33.jpg)
![Page 34: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/34.jpg)
VDI 3.0 VDI 3.18 Monate 7 Monatev47 v22
174 Slides 271 Slides
VDI 3.2 VDI 3.36 Monate 7 Monatev18 v8
297 Slides 317 Slides
![Page 35: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/35.jpg)
»Bei 25 Folien pro Sekunde bewegt sich das Bild.«
Lorenz Engell in Powerpoint, Fischer 2009
![Page 36: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/36.jpg)
![Page 37: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/37.jpg)
![Page 38: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/38.jpg)
![Page 39: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/39.jpg)
![Page 40: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/40.jpg)
http://blogs.sun.com/mprove/entry/vdi_3_ux_story_wireframes
» intelligent misuse «OOo Impress als
HyperCard-Ersatz
![Page 41: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/41.jpg)
Wireframes sind Layout ohne Visual Design.
Wireframes können Interaktions-Flows darstellen→ Storyboards
Wireframes sind Sketches, Mockups, Prototypen oder Spezifikationen.
Kommunikation zwischen Designer und EntwicklungKommunikation zwischen Designer und QualitätKommunikation zwischen Designer und Dokumentation
Wireframes sind Planungs- und Designmedium.
![Page 42: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/42.jpg)
Balsamiq
![Page 43: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/43.jpg)
Axure
![Page 44: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/44.jpg)
via http://www.scaffoldage.com/post/3853646769
Vielen Dank!
![Page 45: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/45.jpg)
45
Weblinks
www.mprove.de– mprove.de/script/11/wireframes/ – blogs.sun.com/mprove/
User Experience in Hamburg– uxhh.de– ixda-hamburg.de
Virtualisierung bei Oracle– oracle.com/virtualization– sun.com/vdi
![Page 46: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/46.jpg)
46
![Page 47: Wireframes im Interaktionsdesign](https://reader034.vdocument.in/reader034/viewer/2022052619/5551cbddb4c905c2388b4907/html5/thumbnails/47.jpg)
47