Create dynamic interface elements

Create dynamic interface elements

Christoph Helzle of interactive digital agency Fantasy Interactive explains how you can save time on interface designs by creating reusable components.

Most websites have the same elements in their user interface, such as menus and buttons. With an intelligent structure under the hood, you can reuse components in various projects with dramatically different visuals. This saves you from redoing the basics every time and enables you to focus on the fun, creative parts of the process.

In this tutorial, I will share some techniques we use extensively in our work at Fantasy Interactive. While our approach can be used for many elements, I've decided to concentrate on a simple widget in order to explain in detail how to set it up so the design can be changed with minimal work. Because there's a lot to communicate, the final files are on the disc, and I've chosen to walk you through the individual pieces and logic step by step.

Click here to download the support files (711KB)

Click here to download the tutorial for free

Computer Arts magazine subscriptions

Join the community!

Sign up to comment on articles, get exclusive offers and receive our newsletter!

CA Collection
Advertisement: Professional Awards
Dell Creative Studio
Become better connected

@computerarts

  • Work on the web? Help out our chums at @netmag by taking their web design and development survey - http://t.co/7tX6WgzZ

    4:35PM Feb 3rd via web

site stat collection