calvinte / ixd13_calvintennant_navbar

#ixd13 presentation, Moving Past the Navbar

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Moving Past the Navbar

Calvin Tennant

Slide notes:

SLIDE 1 introduce myself.

SLIDE 2

If a discussion about you're next project's information architecture includes the question: "So, what's going in the navbar?", you're doing it wrong.

I need to be clear: when I'm using the term navbar, I'm discussing the series of toggle buttons commonly presented at the top of a website that bring you to important internal pages.

Navbars have served the web-development community pretty well over the last fifteen years. With standard screen sizes they are still very popular, and often complete their goal of navigating the user quickly through the website. With more users using different screen sizes and devices, navbars are quickly starting to fail as an effective method of navigation. Here are some popular examples.

SLIDE 3

Oversized navbars are a poor navigational solution because they require the ability to define the purpose of an endpoint, often without context, in one or two words. Context can often be provided by using a series of nested links that linearly classify you're applications pages, but this is a band-aid solution that usually ends up providing too much information to the user, and complicating their decisions

SLIDE 4 Aside on linear classification, draw a line in the sand between two endpoints.

We all know that that's not what the internet looks like.

SLIDE 5

So, what does the network look like? Depending on the types of information your product collects, it probably looks a lot like this. I hate to pick on Ebay, but let's take another look there for a second. I'm willing to bet that there's a lot of overlap going on between these categories. You can imagine a lot of products that belong in 'Sporting goods' also belong in 'Toys & hobbies'. Now, that being said, I don't exactly know what the navigational solution for Ebay is, but I don't think top-down linear classification is working.

SLIDE 6

This design pattern can often be replaced with a clever content strategy, and a few internal links. In situations where your product requires more complexity, you can often use a combination of contextual links and historical navigation. This style of navigation allows the user to discover the intricacies your information architecture, and gives you more control over their experience. see: twitter, explain that twitter's navbar consists of contextual links, explain twitter's sub-nav, draw similarities to iOS.

Depending on the size and complexity of your information architecture, a concise navbar can be an acceptable component of your navigation. A small number of distinct top-level endpoints can greatly simplify a complex system, but too many elements makes the complexity apparent and can cause confusion and frustration to the user.

SLIDE 7

say thank you, ask for questions, mention your twitter account, also the slides are on github

About

#ixd13 presentation, Moving Past the Navbar


Languages

Language:JavaScript 100.0%