Lab 0: Designing Systems

Goal

Learn about...

  • Why designers should care about designing interfaces in a more systematic way
  • The history of modular design systems.
  • How the Web landscape is shifting everyday.

Key Concept

Brad Frost is writing a book about Atomic Design which discusses the importance of crafting robust design systems, and introduces a methodology for which to create smart, deliberate interface systems. We're going to read part of it today and make some observations.

Pre-lab

Pre-lab Reading

Designing Systems chapter 1, up to the section about Design systems save the day.

Pre-lab Activity

Answer the pre-lab quiz questions in Blackboard once you complete the reading above.

Be sure to do the reading and answer the pre-lab questions in Blackboard before the start of the lab period.

In-lab

Info

Note that these instructions are not always detailed. You must figure out some of the detail by reading the textbook and investigating online sources. You can always ask your instructor for help. If your instructor is busy helping others, raise your hand to make sure the instructor sees that you need help, but then put your hand down and go back to work. As you wait for help, try your best to solve the problem on your own by reading the textbook.

Working with others

You can work together with a partner during lab. But after the lab session is over, you must complete this activity independently. Be sure to email your partner relevant files before the end of the lab session.

You should not collaborate with anyone outside of the designated two-hour lab session.

More Reading

Finish the rest of the chapter of Frost's book

Activity

Answer the following questions in a Word document. Name your document lab0LastName.doc that includes the questions below and your answers.

Lab 0 Questions

by [Insert Your Name Here]

  1. Why is it difficult to answer how long it will take to build something? Find examples of two extremes of sites and include the URLs.
  2. What is a better way to judge the difficulty of a project?
  3. What are some of the problems associated with replacing a company's website every few years? Find samples of Siena's old site and new site and include the URLs. To find examples of the old site, you will probably have to go Internet Archive Wayback Machine to see examples of old versions of the website.
  4. What is responsive web design? Go to the This is Responsive page. Find the conditional lightbox option under lightbox. What happens when you change the width of the browser window? Make it really narrow and then wide
  5. List some of the benefits and drawbacks of using a framework like Twitter bootstrap?
  6. What are the different parts of a style guide?
  7. Find Siena's style guide. Look through it and determine what, if any, parts of the style guide it is missing.
  8. Explain why a voice and tone guideline may be required.
  9. What are the major challenges to using style guidelines for projects?
  10. In the last section of the chapter, Brad Frost has a link to examples of pattern libraries. One of the starred examples is Carbon Design. For what company was this design system developed?

Deliverables

Upload your lab0LastName.doc file with your answers to Blackboard. You will be graded based on the quality of your answers.