User Interface Design Patterns

When taking the course “UI Design Patterns” I learnt the basic patterns used for interfaces design. At the same time, I’m learning how to build e-learning content with Articulate Storyline, so I thought it would be a good idea to merge the design theory with the practice of the authoring tool.

Interface patterns can be grouped in different categories, depending on their function: for organizing content, for navigating, for structure the page, for getting input from the user, etc.

I made a presentation with five patterns used for organizing content:

  • Two-panel selector
  • Navigation tabs
  • List inlay
  • Slideshows
  • Hub and spoke

Although they were originally designed for websites,
they can also be applied in Articulate’ slides.

Click on the image

UI_Design_Patterns

 

I’m aware the aesthetics might be better (I’m still not expert ;)),

but I focused on each pattern’s implementation.

Hope you find this topic as interesting as I do.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s