Throughout Lecture Pod 3: Design Patterns, it states the different types of basic design patterns for screen and how and where they are used within a website plus what each of them mean. In terms of the conventions that have developed; user interface and page composition.

According to Christopher Alexander, he refers to it as design patterns in interactive design go above and beyond style plus visual repetition. Having similar and reusable solutions that have a working function often seen in screen design. Whilst User Interface Design Pattern Library states that, design patterns can be defined a recurring solution that solve common design problem.

Using responsive design has some side effects, due to other sites being similar also the increase of WordPress sites and theme provided. Because of the way the we’ve altered and consumed the web, resulting a large of common user interface design patterns and therefore have little way for innovation for user interface patterns.

Patterns used within a website:

  • The Hamburger Menu – has three parallel horizontal line; saves space
  • Account Registration – e.g. found whenever users register for a site.
  • Long Scroll – works well for sites, wanting to lure users through storytelling and mimic multipage site.
  • Card Layouts – presents information invite and perfect for scanning; easy to rearrange.
  • Hero Images – one of the fastest ways as it grabs the user’s attention
  • Animation – used to enhance the sites storytelling, more interactive/entertaining for user’s experience.
  • Material Design – uses shadow effects, movements and depth, showing a realistic design to the user.
  • Responsive Design –relatively simple and cheap way for businesses to build a fully functional mobile friendly website.
  • Flat Design – compatible with other trend.

Animation include:

  • Loading animations
  • Navigation and menus (non scrolling) Animation
  • Hover Animations
  • Gallery and Slideshow Animation
  • Motion Animations
  • Scrolling and Background animations/videos


Therefore, from this lecture I absorbed the patterns mentioned within symbolising its various uses however, not all of them should be used and therefore, should be only incorporated to suit your website. Also, the context within should enable the audience to understand what your project is about and whether or not the audience is satisfied with the design.



Leave a Reply

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

You are commenting using your 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