Optomized Design Patterns

Posted by on Feb 24, 2013

Allowing for modular and responsive design patterns helps ensure a more flexible schedule, better maintenance and improved experience across multiple platforms. Responsive design means creating flexible CSS classes for different screen sizes. Scrolling design makes pages animate with effects like parallax to give a smooth and modern feel to simple content. Mobile design means optimizing your site for the mobile phone browsing experience.

Responsive Design

Responsive design creates multiple layouts using modular design patterns. Each modules is ascribed a percentage of em value in CSS. This helps establish a system of relations rather than a fix layout like those of print. Responsive design makes a website more accessible. Maybe large corporate websites now use responsive patterns to make their site more accessible. This website also uses this design principle. If you are on a desktop browser, try resizing the width of your browser to see this in action. Once you reach a certain width, the browser will begin to read different parts of the CSS file.

Mobile Design

Designing a dedicated Mobile site is sometimes the best option when building a comprehensive web strategy. This often works best when the content or procedures of the desktop site is not optimized for a mobile experience. This is often the case for e-commerce or data driven initiatives. If a shopping checkout flow needs to be completely redesigned for mobile, then it might make sense to simply have the mobile experience be separate from the desktop experience. One pitfall of this method is an endless redirect when a user types a desktop URL into a mobile browser, and can only access the mobile site. It is important to make these sites flexible. Just because you’ve designed a good mobile site doesn’t mean the desktop site can be left with no mobile optimizations.

Information architecture becomes especially important when designing for mobile. The experience must be well thought through in order to give the pest possible results.

Scrolling Design

Scrolling design patterns are one of the newer design paradigms. It is often more difficult to define how a continuous scrolling site will be implemented than more statics websites. With this project we set out to make a site that would scroll through three simple sections. Although the site will continue to be iterated on, the overall direction was well considered and all the elements found a home in the final layout. When fully realized, these types of design patterns can yield incredible results.