Rethinking Design, from Scratch

splash.png

When we set out to build our next-generation platform, we took the time-tested user-centered approach. In addition to our own platform, we took a hard look at the other tools people are using, how they’re using them, and what they’ve come to expect. Starting from scratch we knew we had a monumental task on our hands, but we were confident if we focused on the right things we’d be successful.

In business, Jeff Bezos advises focus on the things that are not going to change. We think the same applies for any individual product so we came up with a list of things we knew would not change to help focus and inform our work. This is what we came up with:

  • Users would always need access to common functions like search and filter content, read text, click links and buttons, enter data into forms, etc.

  • Users would always benefit from a consistent user experience

  • Users would always need access on screens of wildly varying sizes

  • Users needs and desires would always be changing

  • No matter how big we got, we would always wish we had more resources than we had

We needed an approach that would be economical to build and maintain and provide the foundation so that even if we couldn’t know what might need to build down the road, we wouldn’t discover we’d painted ourselves into a corner.

To meet these the requirements, we developed the Tenlegs Design System.

Design systems alleviate many of the problems that arise from the more traditional design approach of developing a static style guide then designing new features on top of that. With a design system, the style guide and the features are one and the same.

The design system we’ve built at Tenlegs has enabled our small team to deliver solutions for the ever-changing needs of diverse college and university populations in record time.

You can read about design systems and atomic design here and here, but the basic metaphor behind the concept is that we design interfaces from a hierarchy of structures analogous to those found in nature:

  • Atoms (interface elements like buttons and menus) are assembled into..

  • Molecules (functional blocks like content cards and forms);

  • Different molecules into organisms (like search applications and workflows);

  • Organisms coexist in an environment (such as user administration and event management). The design system even accommodates breakpoints so we can deliver the right experience for the user’s screen size.

Design systems are the most economical way to...

  • Give leverage to small teams

  • Enable scale to large teams

  • Increase design speed

  • Increase development speed

  • Ease maintenance

  • Ease testing

  • Improve overall user experience

  • Ensure high-quality product

  • Increase consistency across products and platforms

A design system lets you “set it and forget it” for all the constituent components.

buttons.png

When you put them all together, you get products that work well and look great without having to tinker and tweak.

The heavy lifting up front has paid off. Our design system continues to grow and evolve. New features can be built in minutes or hours where they might have taken days or weeks. With a design system, we get to focus more on the user and helping her to achieve goals in a consistent way, rather than reinventing for each new problem.