Takeaways for UX Sunday at HourSchool – Training in Digital Design and Development

I recently attended 5 one hour sessions overviewing the discovery, design and development process on creating for digital and web. The classes were though Hour School and held at the AC4D building.

Introduction to UX: Personas, Scenarios and Storyboards

By Ruby Ku


  • A persona is a fictional user profile based on real data from research.
  • Personas should include: backstory, motivations, frustrations, their ideal experience and a quote in the first person.
  • Research sources: market research, focus groups and user data from website system and analytics.
  • Make a list of words that appear to the demographic. What vocabulary do they use.
  • Answer “How does this persona make decisions?”.
  • Even if there’s no research budget asking 3-5 people’s opinion on a design goes a long way.
  • Just asking people on Facebook and Craig’s list to take a quick user test can happen today for ten dollars a test.

I asked her about buying persona information and sources of template user profiles. She had a great point of explaining that skipping the research process would make you miss one of the main reasons of the exercise, GAINING EMPATHY.

Advanced UX: Wireframing and Detailed Design

By Rob Stokes


  • There are three main phases of the interaction design process, discover, design and deliver.
  • Discover: stakeholder interviews, competitive/comparative research, heuristic evaluation.
  • Design: sketching, sitemaping, information architecture, sitemaping, visual design, user testing.
  • Deliver: annotate wires and comps, screen states, visual style guides, visual assets.
  • Scenarios are time/sequenced based experiences that bring your personas to life.
  • An effective short storyboard should be only 2-8 frames with a comprehensive story for the viewer to take in.
  • A storyboard should show only the major touch points between the user and the system.

Suggested reads

Introduction to Visual Design: Color, Type, and Composition

By Joannie Wu

In this one hour class Joannie covered color, type and grid. She regularly teaches a one hour class on each topic.


  • Windows phone is better than iPhone in the way it makes content king over imagery being king on the iPhone.
  • If you want to breakdown design to the most basic elements you could use grid, type and color.
  • Slab serif fonts work on digital screens because the serif has humanistic tendencies and the serif doesn’t breakdown.
  • Rule of thumb for dimensions: a workable canvas for websites is 960×650.
  • Rule of thumb for text: 7-10 words per line
  • Rule of thumb for type size: 12 pt type and 16 pt leading, you can usually just add 4 to your type size to get leading.
  • Be careful that color can be more unpredictable on the end user’s screen compared to size, shape and contrast.


Introduction to Front-end Web Technologies: HTML5 and Basic css

By Andre Ortiz

This was a good overview on HTML and CSS. I already new most of it but did learn about some of the the HTML5 tags. This was a very hands on writing code atmosphere and I don’t have many notes for this session. However I personally find W3Schools to be the best resource and just bought the books HTML5 & CSS3 FOR Web Designers from A Book Apart.

Introduction to Front-end Interactivity: Javascript, jQuery, and Advanced css

By Brian Romanko

This was also a very hands on coding session and I don’t have many notes for it. However Brian did a great job of making jQuery look easier than I though and more approachable. The jQuery documentation is great and very usable. It’s a great place to start and many coders continue to use it though out their development process.

Overall the sessions were great and very affordable and certainly worth my time. I’d advise signing up to Hour School just to keep tabs on other classes coming out.


Leave a Comment

Your email address will not be published. Required fields are marked *