nur prototyping
Download
Skip this Video
Download Presentation
NUR - Prototyping

Loading in 2 Seconds...

play fullscreen
1 / 36

NUR - Prototyping - PowerPoint PPT Presentation


  • 152 Views
  • Uploaded on

NUR - Prototyping. Low Fidelity. User interface design - big picture. UI Design app. models (GOMS, KLM, HTA, CTT, etc.) prototypes final design 3 parts visual design interaction design UX design. User Research. User Modeling personas mental models. Application Domain.

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about ' NUR - Prototyping' - jolene


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
nur prototyping
NUR - Prototyping

Low Fidelity

user interface design big picture
User interface design - big picture
  • UI Design
  • app. models (GOMS, KLM, HTA, CTT, etc.)
  • prototypes
  • final design
  • 3 parts
    • visual design
    • interaction design
    • UX design

User Research

  • User Modeling
  • personas
  • mental models

Application Domain

  • Documentation
  • visual design
  • interaction design
  • UX design
  • Problem Description
  • sources: marketing research
  • User Requirements
  • scenarios
  • HTA
  • storyboards
  • UI Testing
  • KLM
  • CW
  • EE
  • user testing (UX)

step 4

step 0

step 1

step 2

Implementation

step 3

step 5

NUR - Prototyping (low fidelity)

mummy construction site inspection

Mummy - construction site inspection

Paper prototype

Electronic prototype (HTML, PPT)

mummy construction site inspection1
Mummy: construction site inspection

Mummy Server

constructionplans

Construction site

Adaptation

Collaboration

Inspector

Remote expert

NUR - Prototyping (low fidelity)

mummy construction site inspection2
Mummy: construction site inspection

NUR - Prototyping (low fidelity)

electronic prototype
Electronic prototype
  • HTML prototype
  • PPT prototype

NUR - Prototyping (low fidelity)

what must be done before
What must be done before
  • User research (D1)
  • Problem description, UI modelling
    • HTA, STN

NUR - Prototyping (low fidelity)

ms powerpoint
MS PowerPoint

NUR - Prototyping (low fidelity)

Vector graphics

Hyperlinks

Embedded videos, images

Animations

ms powerpoint vector graphics
MS PowerPoint – vector graphics

Lorem Ipsum je demonstrativní výplňový text používaný v tiskařském a knihařském průmyslu. Lorem Ipsum je považováno za standard v této oblasti už od začátku 16. století, kdy dnes neznámý tiskař vzal kusy textu a na jejich základě vytvořil speciální vzorovou knihu. Jeho odkaz nevydržel pouze pět století, on přežil i nástup elektronické sazby v podstatě beze změny. Nejvíce popularizováno bylo Lorem Ipsum v šedesátých letech 20. století, kdy byly vydávány speciální vzorníky s jeho pasážemi a později pak díky počítačovým DTP programům jako Aldus PageMaker.

NUR - Prototyping (low fidelity)

Shapes

Styles

Groups

Z-axis

ms powerpoint hyperlin ks
MS PowerPoint - hyperlinks

NUR - Prototyping (low fidelity)

ms powerpoint action
MS PowerPoint - Action

NUR - Prototyping (low fidelity)

ms powerpoint animation
MS PowerPoint - animation

NUR - Prototyping (low fidelity)

Custom animation

Fading

Emphasis

Move on path

ms powerpoint example
MS PowerPoint - example

NUR - Prototyping (low fidelity)

windows classical theme
Windows – classical theme

Soubor

Úpravy

Formát

Nástroje

Možnosti

Nápověda

Pokračovat

výběr toho

nebo onoho

výběr čehokoliv

Text.pole s nabídkou

Textové pole

NUR - Prototyping (low fidelity)

text insertion
Text insertion

Vpisování textu nahrazeno stiskem tlačítka a vyplněním přednastaveného textu.

NUR - Prototyping (low fidelity)

openoffice
OpenOffice

NUR - Prototyping (low fidelity)

Similar to MS Office

Object animation in context menu

web simple web page
Web - Simple web page

NUR - Prototyping (low fidelity)

  • Screenshots
  • Active parts – hyperliks
    • click map
    • table
    • div
  • Shortcut keys
web clickable area
Web – clickable area

mapa.png

NUR - Prototyping (low fidelity)

web clickable area1
Web – clickable area

NUR - Prototyping (low fidelity)

<map name="mapa">

<area href= "link1.html" shape="rect" coords="10,10,210,110">

<area … >

</map>

<img src="mapa.png" usemap="#mapa">

web table
Web – table

Lorem Ipsum je demonstrativní výplňový text používaný v tiskařském a knihařském průmyslu. Lorem Ipsum je považováno za standard v této oblasti už od začátku 16. století, kdy dnes neznámý tiskař vzal kusy textu a na jejich základě vytvořil speciální vzorovou knihu. Jeho odkaz nevydržel pouze pět století, on přežil i nástup elektronické sazby v podstatě beze změny. Nejvíce popularizováno bylo Lorem Ipsum v šedesátých letech 20. století, kdy byly vydávány speciální vzorníky s jeho pasážemi a později pak díky počítačovým DTP programům jako Aldus PageMaker.

NUR - Prototyping (low fidelity)

web shortcut keys
Web – shortcut keys

NUR - Prototyping (low fidelity)

Hyperlinks

<a href= "link 01.html" accesskey="A"></a>

web shortcut keys1
Web – shortcut keys

NUR - Prototyping (low fidelity)

JavaScript

<body onkeypress = "show_page(event.which)">

<script type="text/javascript">

function show_page ( key_pressed ){

if (key_pressed == 119)

this.location.href = "index04.html"; else if (key_pressed == 115) this.location.href = "index02.html";

else if (key_pressed == 122) this.location.href = "tel_ct1.html";

}

</script>

web vs presentation
Web vs. presentation?

NUR - Prototyping (low fidelity)

  • Type of application
  • Design speed
    • Experience, reuse, …
  • Interaction
    • mouse, keyboard, … …
electronic program guide
Electronic program guide

NUR - Prototyping (low fidelity)

Visual design - Gimp

Photographs

Snapshost series + JavaScript

epg prototype showcase
EPG - prototype showcase

NUR - Prototyping (low fidelity)

... simple approach

ms powerpoint1
MS PowerPoint

NUR - Prototyping (low fidelity)

Vektorová grafika

Hypertextové odkazy

Vložené obrázky a videa

Animace

ms powerpoint p klad
MS PowerPoint - příklad

NUR - Prototyping (low fidelity)

vkl d n textu
Vkládání textu

Martin Martinovský

J. A. Komenského 321

Martin

Slovensko

NUR - Prototyping (low fidelity)

ad