Navigation & Structure interaction design Jessy Bak 0868672 Communication & Multimedia Design
Inhoudsopgave inleiding ................................................................................................................... 4 Beschrijving type tuin en gebruiker ............................................ 4 De gebruiker ........................................................................................................ 4 Doelen ...................................................................................................................... 5 Voordelen .............................................................................................................. 5 Activiteiten ............................................................................................................ 6 Benodigdheden en eventuele wellness faciliteiten ................. 6 Kennis ........................................................................................................................ 7 Omgeving .............................................................................................................. 7 Type site ........................................................................................................................................................................ 8
Sitemap .................................................................................................................... 8 Sitemap 1 ................................... Fout! Bladwijzer niet gedefinieerd. Sitemap 2 ................................... Fout! Bladwijzer niet gedefinieerd. Sitemap 3 ................................... Fout! Bladwijzer niet gedefinieerd. Sitemap 4 ................................... Fout! Bladwijzer niet gedefinieerd. Sitemap 5 ................................... Fout! Bladwijzer niet gedefinieerd. Sitemap 6 ................................... Fout! Bladwijzer niet gedefinieerd. Sitemap 7 ................................... Fout! Bladwijzer niet gedefinieerd. Sitemap 8 ........................................................................................ Fout! Bladwijzer niet gedefinieerd.
Scenario’s en prototype schetsen ................................................. 9 Scenario 1 ................................................................................. 9 inleiding ..................................................................................... 9 Scenario .................................................................................... 9 Home pagina ......................................................................... 10 Home pagina met drop down menu sauna’s ................... 11 Informatie pagina infrarood sauna ..................................... 12 Scenario 2 ............................................................................... 12 inleiding ................................................................................... 12 Scenario .................................................................................. 12 Home pagina ......................................................................... 13 Home pagina met drop down menu onderhoud ............. 14 Keuze pagina onderhoud van baden ................................ 15
2
Onderhoud pagina jacuzzi ...................................................................................................... 16
Filters ......................................................................................................................... 16 Filter pagina ........................................................................................................................................................................ 17 Sauna Filter ......................................................................................................................................................................... 18 Variant 1 ............................................................................................................................................................................... 18 Variant 2 ...................................................................................................... Fout! Bladwijzer niet gedefinieerd. variant 3 ................................................................................................................................................................................ 19 Baden filter .......................................................................................................................................................................... 19 Variant 1 ............................................................................................................................................................................... 19 variant 2 ................................................................................................................................................................................ 20 variant 3 ................................................................................................................................................................................ 20
Rationale ............................................................................................................... 20 Persoonlijk verslag ...................................................................................... 21 Bronnen .................................................................................................................. 22 Bijlage ...................................................................................................................... 24 Sitemap 1 ............................................................................................................ 24 Sitemap 2 ............................................................................................................ 24 Sitemap 3 ........................................................................................................... 25 Sitemap 4 ................................................................................................................. 25 Sitemap 5 ............................................................................................................ 26 Sitemap 6 ............................................................................................................ 26 Sitemap 7 ................................................................................................................................................................ 27
3
inleiding
Bij interactieve producten bijvoorbeeld websites, vinden we onze weg via navigatiemenu’s, beelden en geschreven of gesproken taal. Het is belangrijk dat de informatie goed georganiseerd in een interactief product. De opdracht van de module Navigation & Structure is om een voorstel van een website te maken voor een specifieke type gebruiker en tuin. In deze module heb ik geleerd; hoe mensen woorden en beelden gebruiken om hun weg te vinden in een website. De opbouw van navigatiestructuren en een navigatie structuur te maken in de vorm van een prototype die bestaat uit wireframes en een sitemap. In dit verslag is mijn toepassing van de opdracht te zien.
Beschrijving type tuin en gebruiker De gebruiker Ik heb gekozen voor de wellness tuin. Wij hebben thuis ook wellness, het leek mij daarom erg handig om dit als soort tuin te kiezen. Ik heb dan een beter beeld van de tuin. Deze tuin is gericht op je eigen kuuroord aan huis. Je kan hier tot rust komen op elke wenselijke manier. De wellness tuin is duur in aanschaf en een grote tuin is noodzakelijk. Daarom is de doelgroep voor deze tuin volwassen mannen en vrouwen met een hoog budget en een voldoende grote tuin. De tuin moet genoeg ruimte hebben voor alle wellness elementen. Wellness betekent gezondheid. Wellness is een combinatie van de twee woorden wellbeing en fitness. Onder wellness valt alles wat met ontspanning, genieten, rust en herstellen te maken heeft.
4
Doelen De mensen met dit type tuin hebben als doel ontspannen/tot rust komen, genieten van hun tuin en actief of inactief werken aan de gezondheid. De tuin kan een grote rol in hun leven spelen. Mensen met een zware baan kunnen hier tot rust komen waardoor de stres minder zal zijn. Of mensen die ziek zijn en veel pijn hebben kunnen deze tuin gebruiken om de pijn te verzachten. Ook kan het gewoon voor het plezier zijn om te genieten. Ze zullen rust ervaren als zij in de tuin zijn. Het is een plek om zich terug te trekken uit het drukke leven en tot te rust komen.
Voordelen • Warm water opent de bloedvaten, dit zorgt voor een betere doorbloeding. Doordat het water voor gewichtloosheid zorgt, wordt de druk op de spieren minder. Hierdoor krijgen de spieren de kans om ook te ontspannen. • Verminderd de stress. 80% van de ziektes worden veroorzaakt door stress. • Geneest spier en gewrichtspijn. • Goed voor sport prestaties. Wellness ontspant het lichaam en de spieren komen los, hierdoor worden de sport prestaties makkelijker en na het sporten voorkomt het stijfheid van de spieren. • Dagelijks gebruik van de Jacuzzi verminderd cellulitis. • Betere nachtrust. • Goede genezing van het lichaam. De wellness verwijderd snel de slechte stoffen uit het lichaam. • Verzacht chronische pijn. De wellness verwarmt de gewrichten en verminderd de zwelling van het weefsel waardoor deze elastischer wordt.
5
Activiteiten De belangrijkste activiteit in de tuin is genieten en tot rust komen. Maar het is belangrijk in een wellness tuin dat deze schoon is en goed onderhouden moet worden. Zo moeten de planten in de tuin bijgehouden worden, losse blaadjes moeten weggehaald worden, de faciliteiten moeten schoon blijven of zelfs (water) verschoond worden, de faciliteiten moeten winterklaar worden gemaakt, filters moeten gereinigd worden, sauna’s schimmelvrij houden, ontkalking. Het is aan de gebruiker zelf om te kijken of hij/zij deze activiteiten zelf wilt uitvoeren of hier iemand voor in dienst neemt. Door iemand in te huren zullen de gebruikers meer genieten van hun wellness tuin, omdat zij zelf niet de verantwoordelijkheid hebben voor de onderhoud van hun tuin. Maar het kan ook zijn dat het voor de gebruiker zelfs ontspanning kan zijn om in de tuin bezig te zijn, omdat het even tijd is voor de gebruiker zelf. Als de gebruiker de activiteiten zelf uitvoert is het wel van belang dat de gebruiker weet hoe hij het moet doen en wat hij moet doen, achterstallig onderhoud zorgt voor veroudering van de faciliteiten wat kan leiden tot het minder genieten in de wellness tuin.
Benodigdheden en eventuele wellness faciliteiten • Sauna’s (infrarood (met of zonder kleurtherapie), Turkse sauna, klassieke sauna met houtkachel, sauna met elektrische kachel) • tuinhuis • Waterval • Zonnebank • Douche • Beplanting • Zwembad
6
• Bar • Sportzaal • Massage kamer • Loungebedden • Handdoeken • Betegelde paden • Beplanting • Boxen • Chloor • Schoonmaakmiddel • Schoonmaak producten • Tuinverwarmers • Verlichting • Handdoeken • Rust ruimte • Hamam ruimte • Baden (binnenzwembaden, dompel baden, hottubs, whirlpools, zoutwaterbad,jacuzzi)
Kennis De kennis wat de gebruikers moeten weten is dat de tuin zelf ook rust moet uitstralen, welke wellness elementen er allemaal zijn, hoe de wellness elementen werken en hoe de onderhoud moet worden gedaan van de wellness. De kennis is te verkrijgen bij aanschaf van de wellness elementen en op internet. Ook zijn er verschillende diensten die de elementen onderhouden.
Omgeving De tuin bevind zich aan het huis, in een dorp of stad. Maar de stad is minder vanzelfsprekend, omdat dit vaak kleinere tuinen zijn en met weinig privacy. Een vrijstaand huis met een vrije omgeving is de perfecte omgeving voor deze tuin, maar het is ook mogelijk om deze tuin te vestigen aan een eengezinswoning, zolang de tuin maar
7
over voldoende ruimte beschikt. Het is namelijk aan de gebruiker zelf over hoeveel elementen de wellness tuin beschikt.
Type site De site wordt een informatieve site voor een wellnesstuin, hier kunnen die gebruikers informatie vinden over alle wellness die er zijn en over de onderhoud.
Sitemap
Na veel sitemaps gemaakt te hebben is dit mijn uiteindelijke sitemap geworden. In de bijlage staan al mijn voortgangen van de sitemaps. De uiteindelijke sitemap bestaat uit 4 hoofdcategorieën. Die elk weer bestaan uit subcategorieën, ik ben tevreden over mijn uiteindelijke sitemap. Ik vind het een goede opbouw en de gebruiker hoeft weinig paden af te leggen om bij zijn uiteindelijke doel te komen. De categorieën met de blokjes zijn categorieën met een link. De categorieën met alleen een streep zijn kopjes in een tekst. Ik vond de techniek van een sitemap erg fijn, je kon makkelijk een wireframe maken bij de sitemap. Ik heb dit vak opnieuw moeten doen omdat ik altijd wel weer iets zag wat veranderd, vervangen of weggelaten moest worden.
8
Scenario’s en prototype schetsen Scenario 1 inleiding Ricardo is 43 jaar en woont in Brielle met zijn vrouw. Ricardo heeft een drukke baan als ingenieur. Hij komt vaak met stres thuis, is erg vermoeid en heeft reuma. Hij woont in een vrijstaand huis in een woonwijk. Zijn tuin is afgeschermd door middel van beplanting. Ricardo heeft een verhaal gehoord van een man die ook reuma had en dat de pijnklachten minder zijn geworden na het gebruik van een infrarood sauna. Ricardo wilt zich hier wat verder in verdiepen. Hij wilt meer informatie krijgen over de infrarood sauna en de onderhoud hiervan Scenario Ricardo komt via google op de site World of Wellness terecht. Hij komt direct op de home pagina van de site. Hier ziet hij een groot logo met de tekst “World of Wellness”. Ook ziet hij aan de bovenkant een header met
9
daarin nogmaals het logo, een home knop, een sauna’s knop, een baden knop, een onderhoud knop, een accessoires knop, knop met zoekfilter verfijnen en een zoek balk. De knoppen sauna’s, baden, onderhoud en accessoires bevatten drop down menu’s. Home pagina
Ricardo weet wat hij zoekt en hij gaat direct met zijn muis naar de knop “Sauna’s”. Omdat Ricardo weet wat hij zoekt heeft hij de functie zoekresultaat verfijnen niet nodig. Er is nu een drop down menu te zien met de categorieën; infrarood sauna, Turkse sauna, klassieke sauna met houtkachel en sauna met elektrische kachel.
10
Home pagina met drop down menu sauna’s
Ricardo klikt op de categorie infrarood sauna. De header blijft hetzelfde, aan de linkerkant is nu een Sidebar te zien met de categorieën die eerst te zien waren in het drop down menu onder de categorie sauna. De categorie sauna en de woorden infraroodsauna in de Sidebar zijn anders weergegeven, zo kan Ricardo zien waar hij zich bevind op de website. In het midden van de site ziet Ricardo een kopje “De infrarood sauna” onder dit kopje met tekst staat een volgend kopje “onderhoud”. Naast tekst staan twee afbeeldingen, een afbeelding van een infraroodsauna en een plaatje over de straling van een infrarood sauna. Ricardo heeft nu alle informatie gevonden waar hij naar op zoek was.
11
Informatie pagina infrarood sauna
Scenario 2 inleiding Esmee is 40 jaar en werkt in het vastgoed. Zij woont in Oostvoorne in een vrijstaand huis met haar man en kinderen. Esmee heeft een jacuzzi, deze is al lang niet meer onderhouden. Esmee wilt zich hier eerst verder in verdiepen voordat zij aan de onderhoud van de jacuzzi begint. Scenario Via google komt Esmee op World of Wellness terecht . Zij komt direct op de home pagina van de site terecht. Esmee ziet een header met daarin het logo, een home knop, een sauna’s knop, een baden knop, een onderhoud knop, een accessoires knop, een zoen resultaat verfijnen knop en een zoek balk. In het midden
12
van de pagina is het logo te zien met de tekst “World of Wellness”. Home pagina
Esmee weet wat zij zoekt en zij gaat met haar muis naar de knop “onderhoud”, zij heeft het filter systeem niet nodig. Er verschijnt een drop down menu met de categorieën; sauna’s en baden.
13
Home pagina met drop down menu onderhoud
Esmee klikt op de categorie baden. De header blijft hetzelfde. In het midden van de site staan de categorieën; zwembad, dompelbad, hottub, whirlpool, zoutwaterbad en jacuzzi met foto’s daarvan.
14
Keuze pagina onderhoud van baden
De categorie onderhoud is anders weergeven, zo kan Esmee goed zien waar zij zich bevind op de website. Esmee klikt op de categorie jacuzzi. Er opent een nieuw scherm. De header blijft weer hetzelfde. In de linker Sidebar zijn nu alle categorieën van sauna’s en baden weergeven. Jacuzzi is hetzelfde weergeven als de onderhoud knop in de header. Esmee weet nu precies in welke categorie zij zich bevind In het midden scherm is nu de informatie over de onderhoud van de jacuzzi te zien met als titel: “De onderhoud van een jacuzzi”. Onder deze tekst is weer een kopje te zien met een opsomming van benodigdheden. Aan de rechterkant van de tekst zijn afbeeldingen te zien. Een van een jacuzzi en een van een potje chloor wat nodig is om de jacuzzi schoon te houden. Hier kan Esmee alle informatie vinden over de
15
onderhoud van een jacuzzi en de benodigde spullen daarvoor. Onderhoud pagina jacuzzi
Filters
Ik heb mijn filters verwerkt in de site onder het kopje “Zoek resultaten verfijnen”. Als de gebruiker van de site hier op klikt komt hij op een nieuw scherm op de site terecht. Hier is de filter te zien. De filter werk als een soort stappen plan, er komt steeds een nieuwe vraag gebaseerd op je vorige antwoord. Het filtersysteem bestaat ook uit 2 delen; sauna’s en baden. Dit zijn 2 belangrijke onderdelen in mijn website, ze zijn ook erg verschillend en daarom kunnen deze niet samen worden gebruikt in 1 filter. Op de volgende pagina is het scherm met de filter weergeven.. Vul je bijvoorbeeld alleen de sauna filter in zal je hier ook alleen een zoekresultaat vinden, maar bezoekers kunnen
16
hier ook kijken wat meer bij hun eisen past, een bad of een sauna. Op dit filtersysteem heb ik een aantal varianten gemaakt die voor kunnen komen. Door de keuzes die de gebruiker maakt, wordt er een bijpassend product gezocht die goed bij de eisen van de gebruiker passen.
Filter pagina
17
Sauna Filter Variant 1
Variant 2
18
variant 3
Baden filter Variant 1
19
variant 2
variant 3
Rationale
Ik heb in de website een simpele en veel voorkomende navigatiestructuur gebruikt. De hoofdcategorieën zijn duidelijke termen, de drop down menu’s zijn handig en
20
snel te gebruiken. Wil je de drop down menu’s niet gebruiken is dat ook geen probleem, je krijgt dan een keuzescherm te zien met alsnog alle categorieën. Zo’n keuze scherm is terug te vinden bij het prototype scherm :”de keuzepagina onderhoud van baden”. Ik vond het belangrijk dat de website niet chaotisch was, het gaat tenslotte om een wellness tuin waar rust een pre is. Ik vind dat de site eenvoudig is, maar duidelijk. Ook vind ik het belangrijk dat je altijd weet waar je je bevind in een website, daarom heb ik ervoor gekozen om de categorie waar de gebruiker zich op dat moment bevind anders weergegeven, op de schetsen heb ik deze blauw gekleurd. In de scenario’s heb ik twee van mijn belangrijkste doelen op de site uitgewerkt. Iemand die opzoek is naar informatie en iemand die op zoek is naar informatie over de onderhoud. Ik heb geprobeerd om overal in de site eenheid te creëren, ook dit straalt rust uit. Ik heb geen scenario gedaan voor iemand die opzoek gaat naar informatie via de filters, dit is een bewuste keuze omdat ik een apart filtersysteem heb toegevoegd die bestaat uit stappen. Ik heb deze op verschillende manieren uitgewerkt zonder scenario. Het filtersysteem vond ik een handige oplossing voor de gebruikers die nog aan het oriënteren zijn op wellness. Ze hoeven alleen een paar vragen te beantwoorden en komen bij een product wat aan hun eisen voldoet. Zo hoeven de gebruikers niet alle onderdelen 1 voor 1 te bekijken en door te lezen voordat de gebruikers erachter komen waar ze naar op zoek zijn.
Persoonlijk verslag
In het begin wist ik niet wat ik met de opdracht aanmoest. Ik heb onderzoek gedaan voor 3 verschillende tuinen
21
omdat ik er maar niet achter kwam wat mij nou echt aansprak, ik begon met een vijvertuin en daarna koos ik een specifiekere vijvertuin met koikarpers. Ook dit was niet de tuin waar ik al de weken aan zou kunnen werken en uiteindelijk heb ik gekozen voor een wellness tuin. Ik ben op deze keuze gekomen omdat ik hier al een antal dingen van wist en daardoor hier meer interesse in had. De opdracht zelf vond ik heel leerzaam, maar ook heel moeilijk. Ik heb lang gedaan over de sitemaps, telkens zag ik wel wat dat verbeterd kon worden. Daarna kwamen de wireframes, ik had geen idee waar ik moest beginnen. Met een beetje hulp kon ik met wat vertraging eindelijk van start. Ik heb op het laatste moment nog veel dingen moeten veranderen, aangezien de feedback niet erg positief was. Ik was het er wel mee eens en vind mijn uiteindelijk site veel beter. Door de stappen ben ik het vak goed gaan begrijpen. Ondanks dat het op het laatste moment nog erg stressen was heb ik het vak wel als leuk ervaren. Ik kijk nu ook veel kritischer naar ander websites. Met mijn uiteindelijke product ben ik redelijk tevreden.
Bronnen
Riny Bak (vader) Jo Pauwels (2011) Wellness Thuis Dan Saffer (2009) Designing for interaction Jantien Slob (Docent Navigation & Structure) http://www.elysium.nl/ http://www.gratisadviseurs.nl/question.php?id=65034 http://www.optimalegezondheid.com/hoe-goed-iswellness-voor-je-gezondheid/ • http://www.well4u.nl/wellness-blog/wellness/wat-iswellness/ • http://www.outdoorliving.nl • • • • • • •
22
• http://www.jozon.nl/html/accessoires_sauna_reinigin g.aspx • http://www.infobunker.nl/lichaam-geest/soortensaunas/ • http://mens-en-gezondheid.infonu.nl/diversen/42639infraroodsauna-positieve-effecten-op-je-lichaam-engeest.html • http://www.vsbwellness.n
23
Bijlage Sitemap 1
Sitemap 2
24
Sitemap 3
Sitemap 4
25
Sitemap 5
Sitemap 6
26
Sitemap 7
27
