SlideShare una empresa de Scribd logo
1 de 11
NAVIGATION
NAVIGATION

Most difficult

Most important

Make / Break
Most difficult

NO...
   • Sense   of scale

   • Sense   of direction

   • Sense   of location
Dis
   orie difficult
    Most
       nte
           d
NO... Confused
      • Sense   of scale


 trat ed of direction
      • Sense
s     • Sense   of location
Most difficult

NO...             Confused
    Dis of scale
    Sense
     •
         orie
                 nte
    Sense of direction
     •
                       d
           at   ed
    Sense of location
     •
        tr
 F ru s
NAVIGATION

Where am I?

Where have I been?

Where can I go?
NAVIGATION
Where am I?
               Site
     What...   Page
               Section


Where have I been?

Where can I go?
NAVIGATION
Where am I?
               Site
     What...   Page
               Section


Where have I been?

Where can I go?
NAVIGATION

HOW
Where am I?



                         ?
               Site
     What...   Page
               Section


Where have I been?

Where can I go?
Navigation - HOW?
    Site ID on all pages        Link name = Page title

    Page title                  Indicate site section

        on page

        on browser tab:

1. favicon + Site name          Breadcrumb trail:
                                Home > Cookies > Chocolate
2. favicon + Site name + Page
   title

3. favicon + Page title
Navbar                   vs.       Tag cloud

  Top-down organization                  Bottom-up organization
  (taxonomy)                             (folksonomy)

  Pre-determined                         Categories emerge
  categories (card-                      organically from
  sorting; designer; info                repeated tag use
  architecture is planned
  ahead)
Are tag clouds the future of                                  Web 2.0
navigation?                                                  navigation?

Which one has better usability?

Should you provide alternative ways of
organizing and accessing information?

Más contenido relacionado

Destacado

Unic erasmus expert_exchange2016_09_14
Unic erasmus expert_exchange2016_09_14Unic erasmus expert_exchange2016_09_14
Unic erasmus expert_exchange2016_09_14Ebba Ossiannilsson
 
Банковский брендинг: анализ глобальных кейсов
Банковский брендинг: анализ глобальных кейсовБанковский брендинг: анализ глобальных кейсов
Банковский брендинг: анализ глобальных кейсовArtem Zhiganov
 
РИФ 2016, Ошибки зарубежных компаний при выходе на российский рынок
РИФ 2016, Ошибки зарубежных компаний при выходе на российский рынокРИФ 2016, Ошибки зарубежных компаний при выходе на российский рынок
РИФ 2016, Ошибки зарубежных компаний при выходе на российский рынокТарасов Константин
 
Ossiannilsson sverd icde_on_2015
Ossiannilsson sverd icde_on_2015Ossiannilsson sverd icde_on_2015
Ossiannilsson sverd icde_on_2015Ebba Ossiannilsson
 
Suffolk Teens
Suffolk TeensSuffolk Teens
Suffolk Teensrriis
 
Treatment worksheet 2
Treatment worksheet 2Treatment worksheet 2
Treatment worksheet 2NINANC
 
SCQAA SF Webinar on Agile and SCRUM
SCQAA SF Webinar on Agile and SCRUMSCQAA SF Webinar on Agile and SCRUM
SCQAA SF Webinar on Agile and SCRUMSujit Ghosh
 
РИФ 2016, Рейтинг Mail.ru - аналитический сервис для вашего бизнеса
РИФ 2016, Рейтинг Mail.ru - аналитический сервис для вашего бизнесаРИФ 2016, Рейтинг Mail.ru - аналитический сервис для вашего бизнеса
РИФ 2016, Рейтинг Mail.ru - аналитический сервис для вашего бизнесаТарасов Константин
 
Trabajo realizado para el curso convivencia escolar: prevención en intervenci...
Trabajo realizado para el curso convivencia escolar: prevención en intervenci...Trabajo realizado para el curso convivencia escolar: prevención en intervenci...
Trabajo realizado para el curso convivencia escolar: prevención en intervenci...Piluka Alburquerque
 
Shot types
Shot typesShot types
Shot typesNINANC
 
Charlie Sheen Image Restoration
Charlie Sheen Image RestorationCharlie Sheen Image Restoration
Charlie Sheen Image RestorationDr. V Vorvoreanu
 
РИФ 2016, Совместная работа и творчество сотрудников на корпоративном портале...
РИФ 2016, Совместная работа и творчество сотрудников на корпоративном портале...РИФ 2016, Совместная работа и творчество сотрудников на корпоративном портале...
РИФ 2016, Совместная работа и творчество сотрудников на корпоративном портале...Тарасов Константин
 
Nieuws Bestaat Niet
Nieuws Bestaat NietNieuws Bestaat Niet
Nieuws Bestaat NietRené Quist
 

Destacado (20)

Edenintro sverd 111021
Edenintro sverd 111021Edenintro sverd 111021
Edenintro sverd 111021
 
Unic erasmus expert_exchange2016_09_14
Unic erasmus expert_exchange2016_09_14Unic erasmus expert_exchange2016_09_14
Unic erasmus expert_exchange2016_09_14
 
James Wadsworth
James WadsworthJames Wadsworth
James Wadsworth
 
09 personas task analysis
09 personas task analysis09 personas task analysis
09 personas task analysis
 
Банковский брендинг: анализ глобальных кейсов
Банковский брендинг: анализ глобальных кейсовБанковский брендинг: анализ глобальных кейсов
Банковский брендинг: анализ глобальных кейсов
 
РИФ 2016, Ошибки зарубежных компаний при выходе на российский рынок
РИФ 2016, Ошибки зарубежных компаний при выходе на российский рынокРИФ 2016, Ошибки зарубежных компаний при выходе на российский рынок
РИФ 2016, Ошибки зарубежных компаний при выходе на российский рынок
 
Ossiannilsson sverd icde_on_2015
Ossiannilsson sverd icde_on_2015Ossiannilsson sverd icde_on_2015
Ossiannilsson sverd icde_on_2015
 
Suffolk Teens
Suffolk TeensSuffolk Teens
Suffolk Teens
 
Treatment worksheet 2
Treatment worksheet 2Treatment worksheet 2
Treatment worksheet 2
 
SCQAA SF Webinar on Agile and SCRUM
SCQAA SF Webinar on Agile and SCRUMSCQAA SF Webinar on Agile and SCRUM
SCQAA SF Webinar on Agile and SCRUM
 
РИФ 2016, Рейтинг Mail.ru - аналитический сервис для вашего бизнеса
РИФ 2016, Рейтинг Mail.ru - аналитический сервис для вашего бизнесаРИФ 2016, Рейтинг Mail.ru - аналитический сервис для вашего бизнеса
РИФ 2016, Рейтинг Mail.ru - аналитический сервис для вашего бизнеса
 
Colours of the Wind
Colours of the WindColours of the Wind
Colours of the Wind
 
A2studio2
A2studio2A2studio2
A2studio2
 
Trabajo realizado para el curso convivencia escolar: prevención en intervenci...
Trabajo realizado para el curso convivencia escolar: prevención en intervenci...Trabajo realizado para el curso convivencia escolar: prevención en intervenci...
Trabajo realizado para el curso convivencia escolar: prevención en intervenci...
 
Shot types
Shot typesShot types
Shot types
 
writing for the web
writing for the webwriting for the web
writing for the web
 
Charlie Sheen Image Restoration
Charlie Sheen Image RestorationCharlie Sheen Image Restoration
Charlie Sheen Image Restoration
 
Session 15
Session 15Session 15
Session 15
 
РИФ 2016, Совместная работа и творчество сотрудников на корпоративном портале...
РИФ 2016, Совместная работа и творчество сотрудников на корпоративном портале...РИФ 2016, Совместная работа и творчество сотрудников на корпоративном портале...
РИФ 2016, Совместная работа и творчество сотрудников на корпоративном портале...
 
Nieuws Bestaat Niet
Nieuws Bestaat NietNieuws Bestaat Niet
Nieuws Bestaat Niet
 

Más de Dr. V Vorvoreanu

DIA2 Design requirements presentation personas
DIA2 Design requirements presentation personasDIA2 Design requirements presentation personas
DIA2 Design requirements presentation personasDr. V Vorvoreanu
 
07 principles 1 affordance
07 principles 1 affordance07 principles 1 affordance
07 principles 1 affordanceDr. V Vorvoreanu
 
HCDD for ASEE 2015 presentation
HCDD for ASEE 2015 presentationHCDD for ASEE 2015 presentation
HCDD for ASEE 2015 presentationDr. V Vorvoreanu
 
Responsive design UX intro
Responsive design UX introResponsive design UX intro
Responsive design UX introDr. V Vorvoreanu
 
Attention info scent recognition vs recall
Attention info scent recognition vs recallAttention info scent recognition vs recall
Attention info scent recognition vs recallDr. V Vorvoreanu
 
03 usability def designprocess
03 usability def designprocess03 usability def designprocess
03 usability def designprocessDr. V Vorvoreanu
 
UX Conceptual design - sketches, wireframes, mockups, prototypes
UX Conceptual design - sketches, wireframes, mockups, prototypesUX Conceptual design - sketches, wireframes, mockups, prototypes
UX Conceptual design - sketches, wireframes, mockups, prototypesDr. V Vorvoreanu
 
UX user-centered design process overview
UX user-centered design process overviewUX user-centered design process overview
UX user-centered design process overviewDr. V Vorvoreanu
 
26 social interaction design
26 social interaction design26 social interaction design
26 social interaction designDr. V Vorvoreanu
 
Sketches wireframes mockups prototypes
Sketches wireframes mockups prototypesSketches wireframes mockups prototypes
Sketches wireframes mockups prototypesDr. V Vorvoreanu
 

Más de Dr. V Vorvoreanu (20)

Dia2 tues persona
Dia2 tues persona Dia2 tues persona
Dia2 tues persona
 
Dia2 sketches
Dia2 sketchesDia2 sketches
Dia2 sketches
 
DIA2 Design requirements presentation personas
DIA2 Design requirements presentation personasDIA2 Design requirements presentation personas
DIA2 Design requirements presentation personas
 
gestalt principles cats
gestalt principles catsgestalt principles cats
gestalt principles cats
 
07 principles 1 affordance
07 principles 1 affordance07 principles 1 affordance
07 principles 1 affordance
 
HCDD for ASEE 2015 presentation
HCDD for ASEE 2015 presentationHCDD for ASEE 2015 presentation
HCDD for ASEE 2015 presentation
 
Controls
ControlsControls
Controls
 
Responsive design UX intro
Responsive design UX introResponsive design UX intro
Responsive design UX intro
 
Attention info scent recognition vs recall
Attention info scent recognition vs recallAttention info scent recognition vs recall
Attention info scent recognition vs recall
 
03 bad usability kills
03 bad usability kills03 bad usability kills
03 bad usability kills
 
03 usability def designprocess
03 usability def designprocess03 usability def designprocess
03 usability def designprocess
 
Information architecture
Information architectureInformation architecture
Information architecture
 
UX Conceptual design - sketches, wireframes, mockups, prototypes
UX Conceptual design - sketches, wireframes, mockups, prototypesUX Conceptual design - sketches, wireframes, mockups, prototypes
UX Conceptual design - sketches, wireframes, mockups, prototypes
 
Cgt 256 course review
Cgt 256 course reviewCgt 256 course review
Cgt 256 course review
 
Cross channel ux
Cross channel uxCross channel ux
Cross channel ux
 
UX user-centered design process overview
UX user-centered design process overviewUX user-centered design process overview
UX user-centered design process overview
 
26 social interaction design
26 social interaction design26 social interaction design
26 social interaction design
 
Purdue MS degree CGT
Purdue MS degree CGTPurdue MS degree CGT
Purdue MS degree CGT
 
Sketches wireframes mockups prototypes
Sketches wireframes mockups prototypesSketches wireframes mockups prototypes
Sketches wireframes mockups prototypes
 
11 info architecture-2014
11 info architecture-201411 info architecture-2014
11 info architecture-2014
 

Último

Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Brian Pichman
 
Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024SkyPlanner
 
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...UbiTrack UK
 
Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1DianaGray10
 
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfMachine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfAijun Zhang
 
20230202 - Introduction to tis-py
20230202 - Introduction to tis-py20230202 - Introduction to tis-py
20230202 - Introduction to tis-pyJamie (Taka) Wang
 
UiPath Studio Web workshop series - Day 7
UiPath Studio Web workshop series - Day 7UiPath Studio Web workshop series - Day 7
UiPath Studio Web workshop series - Day 7DianaGray10
 
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...DianaGray10
 
How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?IES VE
 
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdfUiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdfDianaGray10
 
Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.YounusS2
 
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019IES VE
 
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDEADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDELiveplex
 
COMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a WebsiteCOMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a Websitedgelyza
 
Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™Adtran
 
Cybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxCybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxGDSC PJATK
 
Videogame localization & technology_ how to enhance the power of translation.pdf
Videogame localization & technology_ how to enhance the power of translation.pdfVideogame localization & technology_ how to enhance the power of translation.pdf
Videogame localization & technology_ how to enhance the power of translation.pdfinfogdgmi
 
Nanopower In Semiconductor Industry.pdf
Nanopower  In Semiconductor Industry.pdfNanopower  In Semiconductor Industry.pdf
Nanopower In Semiconductor Industry.pdfPedro Manuel
 

Último (20)

Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )Building Your Own AI Instance (TBLC AI )
Building Your Own AI Instance (TBLC AI )
 
Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024Salesforce Miami User Group Event - 1st Quarter 2024
Salesforce Miami User Group Event - 1st Quarter 2024
 
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
UWB Technology for Enhanced Indoor and Outdoor Positioning in Physiological M...
 
20230104 - machine vision
20230104 - machine vision20230104 - machine vision
20230104 - machine vision
 
Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1Secure your environment with UiPath and CyberArk technologies - Session 1
Secure your environment with UiPath and CyberArk technologies - Session 1
 
Machine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdfMachine Learning Model Validation (Aijun Zhang 2024).pdf
Machine Learning Model Validation (Aijun Zhang 2024).pdf
 
20230202 - Introduction to tis-py
20230202 - Introduction to tis-py20230202 - Introduction to tis-py
20230202 - Introduction to tis-py
 
UiPath Studio Web workshop series - Day 7
UiPath Studio Web workshop series - Day 7UiPath Studio Web workshop series - Day 7
UiPath Studio Web workshop series - Day 7
 
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
Connector Corner: Extending LLM automation use cases with UiPath GenAI connec...
 
How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?How Accurate are Carbon Emissions Projections?
How Accurate are Carbon Emissions Projections?
 
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdfUiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
UiPath Solutions Management Preview - Northern CA Chapter - March 22.pdf
 
Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.Basic Building Blocks of Internet of Things.
Basic Building Blocks of Internet of Things.
 
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
IESVE Software for Florida Code Compliance Using ASHRAE 90.1-2019
 
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDEADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
ADOPTING WEB 3 FOR YOUR BUSINESS: A STEP-BY-STEP GUIDE
 
COMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a WebsiteCOMPUTER 10 Lesson 8 - Building a Website
COMPUTER 10 Lesson 8 - Building a Website
 
Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™Meet the new FSP 3000 M-Flex800™
Meet the new FSP 3000 M-Flex800™
 
Cybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptxCybersecurity Workshop #1.pptx
Cybersecurity Workshop #1.pptx
 
201610817 - edge part1
201610817 - edge part1201610817 - edge part1
201610817 - edge part1
 
Videogame localization & technology_ how to enhance the power of translation.pdf
Videogame localization & technology_ how to enhance the power of translation.pdfVideogame localization & technology_ how to enhance the power of translation.pdf
Videogame localization & technology_ how to enhance the power of translation.pdf
 
Nanopower In Semiconductor Industry.pdf
Nanopower  In Semiconductor Industry.pdfNanopower  In Semiconductor Industry.pdf
Nanopower In Semiconductor Industry.pdf
 

navigation

  • 3. Most difficult NO... • Sense of scale • Sense of direction • Sense of location
  • 4. Dis orie difficult Most nte d NO... Confused • Sense of scale trat ed of direction • Sense s • Sense of location
  • 5. Most difficult NO... Confused Dis of scale Sense • orie nte Sense of direction • d at ed Sense of location • tr F ru s
  • 6. NAVIGATION Where am I? Where have I been? Where can I go?
  • 7. NAVIGATION Where am I? Site What... Page Section Where have I been? Where can I go?
  • 8. NAVIGATION Where am I? Site What... Page Section Where have I been? Where can I go?
  • 9. NAVIGATION HOW Where am I? ? Site What... Page Section Where have I been? Where can I go?
  • 10. Navigation - HOW? Site ID on all pages Link name = Page title Page title Indicate site section on page on browser tab: 1. favicon + Site name Breadcrumb trail: Home > Cookies > Chocolate 2. favicon + Site name + Page title 3. favicon + Page title
  • 11. Navbar vs. Tag cloud Top-down organization Bottom-up organization (taxonomy) (folksonomy) Pre-determined Categories emerge categories (card- organically from sorting; designer; info repeated tag use architecture is planned ahead) Are tag clouds the future of Web 2.0 navigation? navigation? Which one has better usability? Should you provide alternative ways of organizing and accessing information?

Notas del editor

  1. \n
  2. \n
  3. \n
  4. \n
  5. \n
  6. \n
  7. \n
  8. \n
  9. \n
  10. \n
  11. \n