Archive for the 'Pattern Libraries' topic

Brad Frost – Building Responsive Interfaces From Atomic Elements

A website can be made up of relatively complex pieces. You have multiple pages, images, maybe some JavaScript, and it all needs to come together to create this larger experience. But as with things in nature, it can be broken down even further than that into more “atomic” elements.

UIETips: Rethinking Mobile Tutorials: Which Patterns Really Work?

In this week’s UIEtips, we offer an article from Theresa Neil and Rich Malley. In it they look at what mobile tutorial patterns work the best. Here’s an excerpt from the article: So, why don’t these patterns work? I turned to the field of game design for answers. Game designers have always known that you […]

Brad Frost – Building Design Systems from Atomic Elements Live!

Have you seen style tiles, element collages, or pattern libraries? These are just a few examples of how designers are reacting to the explosion of devices and interface sizes. After all, thinking about the parts of a “page”—not just the sum of those parts—helps us create smart, scalable, maintainable designs for all those newfangled technologies.

Brad Frost – Creating Responsive Interfaces

Frameworks and design patterns are no strangers in the world of web design. As responsive web design becomes common practice, making sure these templates work across every imaginable screen and device is trickier. There have been attempts to break down page elements in separate modules, but you often never see it fully assembled.

UIEtips: Atomic Design

It’s quite common for designers to develop design systems and libraries of patterns. A designer can save a considerable amount of time if they develop a reliable design system. One that goes beyond colors, fonts, grid etc but rather focuses more on how the various elements and parts become a whole. In today’s UIEtips, we […]

Adopting Pre-Made Design Patterns Doesn’t Help With The Toughest Parts

A well-built design pattern library is an extremely valuable tool for highly productive design teams. It ensures the designs they create feel like they were built by the same folks. It helps everyone on the team understand how things get put together. When combined with a component library, it can shorten development time by using […]

Nathan Curtis – Start Full Screen: Organize, Communicate, and Annotate HTML Prototypes

Nathan discusses how the team at EightShapes brought their modular philosophy to creating rich interactive prototypes using HTML, CSS, and JavaScript. He explains how, through modular thinking, they were able to write scripts that chunked aspects of their designs to repurpose and reuse across multiple pages.

UIEtips: How to Create a UX Design Library

During a podcast recording, back in 2010, Nathan Curtis of EightShapes set me on the right path regarding UX design libraries. As we were talking, I had suggested that a UX Design Library was a snapshot of what the team felt the future of the design would be like. “Oh, no!” Nathan exclaimed. “I strongly […]

Socially-Transmitted Functionality

Pull-to-Refresh is all the rage in mobile apps. Take something like the Twitter client. In the timeline, if you want to see if any new messages have been posted, you pull down on the list with your thumb, then release. The gesture signals the app to check with Twitter’s servers to see if anything new […]

UI16 Spotlight: Mobile Web Design with Luke Wroblewski

[Here's another introduction to one of the folks speaking at the User Interface 16 Conference in November.] Right now, few things are hotter topics that mobile in the design world. With the burst of smartphone and tablet technology, the mobile design landscape has just exploded. With this new landscape comes a new way of thinking […]