Fast Food Functionality: The Hamburger Menu — Design Trends that Effect UX #NHUXPA

  • View
    533

  • Download
    0

  • Category

    Design

Preview:

Citation preview

What is Fast Food Functionality?

UX PATTERNS THAT:

Are fast and easy

Look good

Are very familiar

Can leave you bloated

Should be taken in moderation

…could kill you.

Now Serving…Hamburger Navigations

Meet the Hamburger Icon

The icon indicates a list.

It can come in various shapes and sizes.

It likes to morph into X’s when you touch it.

Now Serving…Hamburger Navigations

The icon allows users to view a hidden list, menu, or block of content.

The menu is hidden due to screen real estate...right?

Now Serving…Hamburger Navigations

in some cases, yes

However…

Now Serving…Hamburger Navigations

Its become a UI designer’s dirty closetFor hiding content in the name of “clean” design.

I blame Dieter Rams

Now Serving…Hamburger Navigations

“Good design is as little design as

possible”

Now Serving…Hamburger Navigations

Now we have photo galleries pretending to be websites tied

together with 30px icons that mean nothing to anyone but the

designer…

WTF?!

Now Serving…Hamburger Navigations

So pretty…but what the hell do you do now?

Now Serving…Hamburger Navigations

Get attacked by a robot…

Now Serving…Hamburger Navigations

Become a mannequin...

Now Serving…Hamburger Navigations

DevelopInsomnia…

Now Serving…Hamburger Navigations

Shit, this logo animation is awesome. But…

Now Serving…Hamburger Navigations

There needs to be a goal and a purpose in

design or it’s not design, it’s decoration.

Here are some UX Patterns that can make your navigation “pretty” enough to not be banished from the screen.

Now Serving…Hamburger Navigations

1. Headroom Hides the menu until you need it; scroll up,

hover the top, or swipe down.

Now Serving…Hamburger Navigations

2. Anchor Points Hide your nav upon scrolling to a specific

point on the page.

Now Serving…Hamburger Navigations

3. Add Extra Features Leaves the main navigation visible, and

gives the user a reason to explore.

Now Serving…Hamburger Navigations

So which one works best?

You’ll have to A/B test to find out.

Nothing works 100% of the time.

But hiding important content

works 0% of the time.

Now Serving…Hamburger Navigations

..and hamburger navs can be a great idea.Just like when you’re about to pull into McDonalds, or Wendys, or Five Guys, or BK, or Sonic, or KFC, or

Taco Bell, or…shit I’m hungry.

Follow me on the twitters:

@jesserandgd

Recommended