2 Today s Lecture Concept Design Mattias Arvola Ideation using structured design concept divergence Structured detailing of concepts ideas Storyboards at a conceptual level Pugh charts Film Time Exciter https://www.youtube.com/watch?v=ocycegskso GROUP WORK day/week 5 6 7 8 9 2 5 6 7 8 9 5 5 52 2 PROJECT PROJECT 2 Checkpoint Research Deadline Research & Concept Deadline Individual Research & Concept Checkpoint Revisions Deadline Revisions & Detailing Deadline Individual Design INDIVIDUAL WORK day/week DESIGN READINGS Seminar Seminar 2 Deadline Individual Readings 5 6 AFTER THE USER STUDY THE OVERARCHING DESIGN IS TO TAKE FORM AND WHAT TO DO IS TO BE DECIDED User Research Deliverables Research-based Personas and Problem Storyboards Design and UX Goals
7 Concept Ideation Deliverables A wide variety of concepts Pugh-charts A concept proposal Poster Other design material? Revisions and Detailed Design Concept Design User Research fuzzy front end: uncertainty >> paxerns >> insights clarity >> focus design criteria ideas concept prototype product A process characterized by Uncertainty Experiments of thought Sketching Judgement and assessment Decisions concept revisions detailing 2 Levels of Interaction Design (Arvola & Artman, 27) Conceptual Level Design Concept Who does what, when, where, how and why? Overarching gestalt, posture or genre Functions and content Actions and objects Structure Temporal, spatial and logical Interaction How does the user navigate the structure to use the functions and manipulate content? Presentation Look & feel. What meets the senses and how is it interpreted. Who does what, when, where, how and why? Agent, act, scene, means och purpose (Arvola, 25) Concept Sheet: http://www.ida.liu.se/~matar/tools.en.shtml
Design Concept Sheet. Mattias Arvola 2. WHAT the name of the concept is: WHAT the concept is: WHO the user is: Design Concept No. WHEN and WHERE it will be used: WHAT the name of the concept is: WHO the user is: Design Concept No. WHAT it does (main function and content): WHY the user whants to have it and use it: WHAT the concept is: WHEN and WHERE it will be used: HOW it is used (draw a storyboard): user's experience before Interaction step Interaction step 2 WHAT it does (main function and content): WHY the user whants to have it and use it: Interaction step Interaction step user's experience afterwards HOW it is used (draw a storyboard): user's experience before Interaction step Interaction step 2 HOW it should be: Principles and qualities Consequences: For people, environment, or society Project: Date: Researcher: HOW it is used (draw a storyboard): user's experience before Interaction step Interaction step 2 Interaction step Interaction step user's experience afterwards Interaction step Interaction step user's experience afterwards HOW it should be: Principles and qualities Consequences: For people, environment, or society Project: Date: Researcher: Design Concept Sheet. Mattias Arvola 2. 7 8 What should it be? Perspec6ve Object Highlighted aspects Tool A material Prac6cal Medium Other people or content Communica6onal Dynamic Gestalt Overarching character More than the sum of the parts Temporal flow and drama structure may be inspiring, dull, obvious or maybe repetitive Partner System ar6fact in itself or quasi-other Other system components Prac6cal Organisa6onal, Technical Machine ar6fact in itself Technical
9 2 To what genre does it belong? Arvola, Lundberg & Holmlid (2) Recurring form, content and purpose Phone bill: Layout (form) showing phone calls and their cost (content), to inform the receiver how much to pay, when, and exactly for what he or she is paying (purpose). What posture should it have? (Cooper, 995) Sovereign: monopolizes the user's attention for long periods of time. Transient: Called when needed, it appears and performs its job, then it quickly leaves, letting the user continue her more normal activity. Daemonic: background processes that require no direct user interaction. Parasitic/Auxiliary: A limited, focused set of functionality and occupy a small space persistently and can be used for a long period of time. 2 22 Ideation by structured design concept divergence Play with and vary who does what, when, where, how and why in a systematic manner. Make experiments of thought: What kind of product or service would it become if Divergence is the mother of design work and iteration its father. WORK SYSTEMATICALLY WITH RANDOMNESS! 2 At conceptual level, different: Purposes Target groups Situations of use Kinds of products/services Platforms User experiences At functional level, different: Objects and actions At strucutral level, different: Layouts Navigation structures Ways to group information At an interactional level, different: Input and output Interaction styles (forms, menus, direct manipulation) Perspectives: st, rd Interaction techniques (zooming, panning, pointclick) Controls At presentational level, different: Styles Associations Level of abstraction Project time Icons
25 Functions-driven divergence purpose is that you should be able to: Communicate with others Look at films Communicate with others Find your way Control what the kids are doing Play games Look at films Find your way Play games Control what the kids are doing 28 Metaphor-driven divergence Communicate with others character of action should be like a: Look at films Find your way Tool Medium Dream Person Game Play games Control what the kids are doing Medium Medium Tool Dream Tool Dream Game Person Game Person
Quality-driven divergence How should it be experienced in use? Full of feeling Discoverably Full of feeling Imaginatively Surprisingly Suggestively Discoverably Imaginatively Suggestively Surprisingly Functions-driven divergence based on Brainwriting -6-5 Discoverably Suggestively Full of feeling Surprisingly Imaginatively 6 persons writes functions and passes the paper on: 8 functions What should the persona be able to do with the product or service? Every function consists of a verb and a noun: pile up chairs Provocative situations of use if you get stuck. Troup transport On the way home from a football game For the Prime Minister At an accident 6 Problem Statement: What should the user be able to do? Idea Idea 2 Idea take photos make call find friends 2 edit photos send message announce statements send photos keep track of appointments Functional Analysis Go through the functions and categorise them from the perspective of you personas: Necessary (N) Desirable (D) Unnecessary (U) Unnecessary but fun (UF) 5 6
55 7 8 List all N, some of the most interesting D, and some UF. Consider what it would be like if one of them was the main function (MF) that would dominate and structure the entire system. Name the resulting product or service Detail the concepts using the concept sheet SKETCHES AND DESCRIPTIONS OF CONCEPTS 9 Sidekick visitors can see the guide s virtual sidekick through the mobile phone. In Vimmerby it could be a rumpnisse who constantly asks Why is that? and gives the guide opportunities to explain things further. Time Machine You can at some places point the camera towards a view and manipulate a time filter towards the past. Show and Tell guide can broadcast film to the visitors mobile phones. Pre- recorded or live. Even the people in the back can see, and details not visible to the naked eye can be pointed out.
Sketchy Concept Video Concept Selection with Pugh Charts 5 6 Good Design in Different Ways Criteria for Concept Selection Technical Build Quality Practical Functionality Communication Organization Concept selection is based on maximizing the contribution to the most important effect goals for the users and other central stakeholders Important product and project goals can also be included Look back at the results from the user research Aesthetic Impact Ethics Time Machine Walking Quiz Show and Tell Interactive Map Sidekick Mythical Creatures Spatial Talking Book Curiosity - + + + - - Leaving Traces Time Machine Walking Quiz Show and Tell Interactive Map Sidekick Mythical Creatures Spatial Talking Book Curiosity - + + + - - Leaving Traces Focus on the Landscape - Focus on the Landscape - Communicate Astrid Lindgren - - + - Communicate Astrid Lindgren - - + - Support Outdoors Education + - + + Cost - + + Feasibility + - + + Viability + + + + Support Outdoors Education + - + + Cost - + + Feasibility + - + + Viability + + + + Longterm Experience + + + - Longterm Experience + + + - Total + 2 5 Total + 2 5 Total - 2 Total - 2 Total5-2 Total 5-2
9 5 Concept Selections Using Pugh Charts Context Scenarios. Consensus about criteria 2. Consensus about alternatives. Assessment of alternatives. Adding it up A scenario that shows how the idea is meaningful for one of the personas Gives a natural sequential flow to the interaction Written or illustrated in a Concept Storyboard 5. Revisit negative assessments 6. Design decisions and syntheses. 5 Concept Proposals in Storyboards Show and Tell: A function for guides to show things not visible to the naked eye. E.g. hidden processes, global systems, or what a plant look like at another season. When the guide wants the group to see something on their phone he/she takes up visual marker. MINNESMARK MINNESMARK visitors point the camera of the phone towards the marker to acjvate whatever the guide wants to show. Maria,&Tom&and&Owen&start&the&Minnesmark&app& to&go&on&a&computer&augmented&treasure&hunt. Maria&chooses&which& treasure&hunt&and&they& are&off.&y&take&part& of&stories&at&places& along&the&way. Use&the&iOS&app&Minnesmark&and& invite&to&in&a&computer& augmented&treasure&hunt,&where& parlcipants&can&explore&both&the& physical&environment&and&media& that&you&have&prepared.&use&the& editor&to&create&the&treasure&hunt. On the display of the phone the visitors can see both the camera view and the object or animajon the guide wants to show. To change the image or the animajon the guide just changes or adds a new marker. Minnesmark&is&an&AR< browser&(ar&=&augmented& reality)&that&builds&on&a&principle& of&physical&interaclon&in&the&real& world.&it&contributes&to&a& molvalng&aclvity.&& parlcipants&find&treasures&in&the& form&of&media,&which&is&sent&to& them&via&email&at&the&end&of&the& treasure&hunt.&using&the&editor,& anyone&can&set&up&their&own& treasure&hunts. Marker<based&augmented&reality&is&used&to& animate&the&story&so&that&virtual&objects&are& embedded&with&the&camera&view&in&the& background.& re&are,&at&some&places,&panoramas& that&show&the&place&as&it&once&was.&tom& navigate&a&panorama&by&holding&his&ipad& infront&of&him&while&turning&around. MaJas&Arvola @majasarvola majas.arvola@liu.se www.minnesmark.se y&find&treasures&in&the&form&of&various& media&along&the&way,&and&the&treasures& are&sent&to&owen's&email&address&at&the& end&of&the&treasure&hunt.&it's&great&that& Owen's&teacher&could&use&the& Minnesmark&Editor&to&set&up&this&trail&for& them.
NÄRSTÅENDE INGALILL GICK BORT FÖR MÅNGA ÅR SEDAN, MEN DIN SON - SIMON, KOMMER ATT HÄLSA PÅ REDAN I MORGON VAR ÄR INGALILL? BEHOV AV VÅRD JAG SKICKAR BOKNINGEN TILLSAMMANS MED EN VÄGBESKRIVNING TILL VÅRDCENTRALEN PÅ STORGATAN -TILL DIN TELEFON SIMON KAN GENOM INVÅNARTJÄNSTERNA MEDDELA PERSONALEN T EX NÄR HAN PLANERAR ATT BESÖKA SIN PAPPA. I SAMMA GRÄNSSNITT KAN PERSONALEN OCKSÅ KONTAKTA SIMON OCH FÖRA ANTECKNINGAR KRING ALBERT. DE SER OCKSÅ DEN INFORMATION (SOM ÄVEN FINNS I JOURNALEN) SOM SOM ÄR VIKTIG FÖR ATT GE VÄRDIG VÅRD - SÅSOM INTRESSEN OCH MATVANOR MM. ÄNDRA TID!!! AAJ VID SIDAN OM ATT HJÄLPA SIN PAPPA KAN SIMON SJÄLV OCKSÅ FÅ STÖD OCH RÅDGIVNING FRÅN INVÅNARTJÄNSTERNA I SIN ROLL SOM ANHÖRIG. adipiscing consectetur congue. amet, lobortis dolor sit ipsum quam vel eros accumlorem a nisi dictum, tellus gravida malesuada lectus elit. Ut Pellentesque cursus quam. a mollis nibh. Proindolor. In commodo enim a interdum facilisis Suspendisse tristique, eget adipiscing luctus san felis Vestibulum euismod. vitae porttitor. tempor eu augue 2 5 6 7 8 9 2 5 6 7 8 9 2 2 22 2 2 25 26 27 IDAG SÅG VI EN OVANLIG FÅGEL NERE VID VATTNET. HAN SÖKER UPP INFORMATION - OCH RINGER DIREKT FRÅN EN ARTIKEL. OLLE HAR REST TILL VÄXJÖ. DÄR BLIR BITEN I HANDEN AV EN KATT. VÅRDCENTRALEN BLIR OCKSÅ INFORMERADE ATT OLLE KOMMER IN OCH FÅR DE UPPGIFTER HAN LÄMNAT TILLSAMMANS MED PERSONNUMMER. BETTET ÄR GANSKA DJUPT OCH BLIR SNART SVULLET OCH ÖMT. OLLE ÄR LITE EXTRA OROLIG DÅ HAN ÄR I EN FÖR HONOM NY STAD DÄR HAN INTE HITTAR. HEJ, SKA JAG RINGA AMBULANS? ÄR DET BRÅTTOM? elit. Ut adipiscing a mollis amet, consectetursuspendisse felis tristique, dolor sit lobortis congue. ipsum accumsan vitae porttitor. eros Lorem tellus quam vel a nisi dictum, eu augue gravida lectus rutrum. Pellentesque cursus malesuada quam. enim a nibh. Proin dolor. In commodo facilisis interdum adipiscing luctus eget Vestibulum euismod. tempor Ditt recept på antibiotika finns nu inlagt och du kan hämta ut medicinen på närmaste apotek. Klicka nedan för att se närmaste apotek med varan i lager. INSTRUKTIONER KORT EFTER SIN BEHANDLING FÅR OLLE ETT MEDDELANDE FRÅN SIN LÄKARE VIA 77 VÅRDGUIDEN MED RECEPT PÅ ANTIBIOTIKA. NÄRMASTE APOTEK GENOM INVÅNARTJÄNSTERNA HAR ALBERT GETT SITT MEDGIVANDE TILL ATT SONEN FÅR SE HANS VÅRDPLAN OCH ÄVEN VARA DELAKTIG I BESLUT. NÄR ALBERTS SJUKDOM FORTSKRIDER BLIR DET TILL SLUT DAGS ATT FLYTTA TILL ETT VÅRDHEM. DÅ KAN SIMON NOGA JÄMFÖRA OLIKA ALTERNATIV OCH VÄLJER ETT SOM PASSAR. SIMON ANVÄNDER INVÅNARTJÄNSTERNA TILL ALLA PRAKTISKA FÖRBEREDELSER KRING FLYTTEN. KRONISK SJUKDOM INFORMATIONEN/ORDINATIONEN ÄR ANPASSAD FÖR OLLE. DET FINNS INSTRUKTIONER FÖR ANVÄNDNING OCH ÄVEN EN KNAPP FÖR ATT SÖKA RÄTT PÅ NÄRMASTE APOTEK MED PRODUKTEN I LAGER. SIMON KÄNNER SIG TRYGG MED ATT PAPPAN FÅR BRA VÅRD, OCH KAN SE PLANERADE OCH GENOMFÖRDA AKTIVITETER....OCH NÄR SIMON TRÄFFAR SIN PAPPA PÅ VÅRDHEMMET KAN DE UMGÅS OCH PRATA OM DAGEN. SLUTA RÖKA JAG HAR INTE HUNNIT SKICKA IN VÄRDENA FRÅN MOBILEN. SKÖNT ATT ALLT FINNS PÅ MITT KONTO SÅ KAN VI KOLLA DÄR DET HÄR ÄR HABIB. EFTERSOM HON HAR DIABETES STÅR HON I REGELBUNDEN KONTAKT MED VÅRDEN. FÖRSTA DAGARNA GÅR BRA NADINE FÅR OCKSÅ UPPMUNTRANDE MEDDELANDEN OM ATT HON GÖR RÄTT SOM INTE RÖKER. guiden Vård NADINE VILL BLI GRAVID OCH HAR BÖRJAT FUNDERA PÅ ATT SLUTA RÖKA, MEN INTE TAGIT FÖRSTA STEGET ÄN. VÅRDCENTRAL SOM INLOGGAD KAN HON BESTÄLLA UTRUSTNING OCH HJÄLPMEDEL... MEN VISSA STUNDER ÄR DET SVÅRT OCH NÄR HON ÄR NÄRA ATT FÅ ÅTERFALL SÖKER HON STÖD OCH MOTIVATION GENOM TJÄNSTEN...TILL EXEMPEL FÖR PROVTAGNING DIREKT IN I DIABETESAPPEN. HON TRÄFFAR EN VÄN PÅ ETT CAFÉ OCH BERÄTTAR OM SIN VILJA ATT BLI GRAVID. EN SAMLAD BILD LEDER TILL ETT BRA MÖTE PÅ VÅRDCENTRALEN DET HÄR SER BRA UT, OCH DET SYNS PÅ DINA VÄRDEN ATT DU HAR BÄTTRE HÄLSA NU MOT NÄR VI SÅG SIST. HON FÅR VISUELLA MÄTVÄRDEN ÖVER TID SAMORDNING, VALFRIHET OCH KONTROLL ÖVER SINA UPPGIFTER ÄR EXEMPEL PÅ SÅDANT SOM INVÅNARTJÄNSTERNA HJÄLPER TILL MED OCH SOM ÄR VIKTIGT FÖR ATT SJUKDOMEN INTE SKA TA FÖR STOR PLATS I HABIBS VARDAG. HÄR, TESTA DET HÄR, DET ÄR ETT HJÄLPMEDEL FÖR ATT SLUTA SOM JAG BLEV TIPSAD OM PÅ MVC. Inför ditt besök 2/ BOKA NU Överför din insamlade data ÖVERFÖR ETT VERKTYG SOM FUNGERAR BRA FÖR NADINE ÄR ATT ANVÄNDA FORUM. HÄR FÅR HON KONTAKT MED ANDRA OCH KAN ABST INENS DELA TIPS. FORU VAD ROLIGT ATT NI VILL HA BARN! MEN DÅ MÅSTE DU JU SLUTA RÖKA MED DETSAMMA. OCH MOTIVATION TILL FYSISK AKTIVITET Du behöver lämna ett blodprov ÅH, DET SER SJYSST UT, JAG STARTAR NU, ALDRIG MER RÖKA.. IP BL IP BL M Lorem ipsum dolor sit adipiscing amet risus temp elit. Pellentesq, consectetur ue volutpat or volutpat. Maur at mauris vel a Ut lacin lacinia molestie, is lorem enim ia, fringilla bibendummassa ut urna ac odio. dictu sapien nibh ut vulputate. m, sed nisi Fusce ultric interdum orna Integer quis Proin porta ies magna vel re vel vel lectu s. cursu Nam aliqu lorem sed comm s tristique. am metu odo fauci s rhoncus bus. massa Lorem ipsum dolor sit adipiscing elit. Pelle amet, consectet ntesque at maur ur is vel Att tänka på inför besöket: Du kommer ombes lämna urinprov... Pellentesq volutpat!!! ue at mauris vel!! risus tempor 59 Final words conceptual design phase ends in a decision on what to do and overarching design. Revisions of Ideas phase starts the with turning objectives and concepts into: Requirements Sketched sitemaps Sketched wireframes Paper prototyping Formative UX testing DU HAR EN TID PÅ VÄXJÖ VÅRDCENTRAL IDAG KL.5 Växsjö Närakut VÄGBESKRIVNING SIMONS PAPPA ALBERT HAR ALZHEIMERS SJUKDOM. BÅDE SIMON OCH ALBERT SJÄLV VILL ATT ALBERT SKA KUNNA BO KVAR HEMMA SÅ LÄNGE SOM DET FUNGERAR MED DE DAGLIGA RUTINERNA. ALBERT VET FORTFARANDE HUR MAN TVÄTTAR SIG, VÄRMER MAT OCH TAR MEDICINER MEN IBLAND GLÖMMER HAN BORT. DÄRFÖR HAR SIMON MED HJÄLP AV INVÅNARTJÄNSTERNA STÄLLT IN PÅMINNELSER FÖR DE AKTIVITETER HAN INTE FÅR GLÖMMA BORT. elit. Ut adipiscing a mollis amet, consectetursuspendisse felis tristique, dolor sit lobortis congue. ipsum accumsan vitae porttitor. eros Lorem adipiscing tellus quam vel a nisi dictum, eu augue gravida lectus rutrum. consectetur Pellentesque cursus malesuada congue. amet, quam. enim a nibh. Proin dolor. In commodo lobortis dolor sit facilisis interdum adipiscing luctus ipsum quam vel eros accumconsequat. eget Lorem Vestibulum erat egestas a nisi dictum, tellus gravida euismod. enim at elit. Sed malesuada lectus elit. Ut tempor Pellentesque non vel cursus a, quam. vulputate eget elit et a mollis Fusce condimentum nibh. Proindolor. In commodo enim a laoreet eros interdum facilisis Suspendisse felis a elit erat erat, consequat posuere tristique, eget adipiscing luctus In consequat. semper. san felis Nulla tincidunt auctor. Vestibulum laoreet Vestibulum egestas vestibulum lectus, dapibus dolor. euismod. enim at erat diam vitae porttitor. aliquet nec turpis tempor elit. Sed nec enim malesuada aliquet orci pulvinar. Mauris eu augue mollis non vel Aliquam diam a, mollis Fusce condimentum Praesent dolor id a velit. vulputate eget elit rutrum. Proin sodales. tincidunt laoreet sodales. massa. Phasellus iaculis vitae, faucibus felis a elit erat erat, consequat eros et Donec ut vulputate In posuere quis, commodo quis urna.quis. Donec Nulla tincidunt auctor. neque laoreet porttitor semper. porttitor et, pulvinar varius dapibus Vestibulum tempus nunc aliquet fringilla, dolor. in sollicitudin turpis vestibulumdiam lectus, fringilla, eu suscipit malesuadaaliquet orci nec pulvinar. Mauris nec enim placerat ligula urna, erat, placeratneque dolor, dolor id mauris. Praesent velit. Aliquam diam erat, vestibulum neque tincidunt faucibus a massa. Proin faucibus vestibulum iaculis vitae, elementum ut vulputate quis, commodo urna. Phasellus Vestibulum neque pulvinar quis tempus quis. et, nunc varius ligula urna, in sollicitudin suscipit molestie mauris. dolor, eu faucibus vitae augue. placerat. elementumid, porttitor pellentesquevitae odio, Vestibulumullamcorper Etiam porttitorpretium non vehicula a sodales facilisis ultrices. tempus diam et interdum, massa lacus. Praesent Nulla dapibus et lobortis convallis ut. nibh. Maecenas tellus, Ut sed metus tristique ligula metus malesuada Quisque placerat libero auctor, accumsan. malesuada quis sapien PERSONEN SOM SVARAR KAN SE ATT OLLE SÖKT PÅ BETT, OCH DÅ HAN ÄVEN KAN SE VAR OLLE BEFINNER SIG SÅ GÅR DET LÄTT ATT HITTA NÄRMAST TILLGÄNGLIGA VÅRD AV RÄTT NIVÅ. DET ÄR VIKTIGT ATT DU FÅR ANTIBIOTIKA OM BETTET ÄR INFEKTERAT. JAG TYCKER VI BOKAR IN DIG PÅ NÄRMSTA VÅRDCENTRAL, REDAN IDAG. PLÖTSLIGT mattias.arvola@liu @mattiasarvola www.liu.se