Responding Beyond the Screen

KSU VCD / inVision Workshop
18-19 October 2014
Instructor: Aaron Ganci
Return to Workshop Home Share your work


The next phase of responsive design will enables sites to respond to factors other than screen size and orientation. Many other factors could impact the exact interface that someone needs to see. Time of day, location, proximity, and sensorial information like biodata are just a few of these factors. Imagine how precisely we could make an layout if we know just a little more about our users.

In this project, I want you to design a webpage for the fictional “Kent Daily News” publication. Instead of thinking about how the interface needs to just respond to screen size, also consider what other contextual factors could impact the design. Would you see different stories if you’re in a different part of town? Would you see stories about preventing a heart attack if your Apple Watch knows you have high blood pressure? Would you get better weather alerts if you were in the path of a tornado? The possibilities are endless.


Learning Outcomes

At the end of this exercise, you will be able to:

  • Isolate user needs tied to a contextual data.
  • Draft a high fidelity mockup of an original web page design at various screen widths.
  • Describe the a complete visual design process for contextually responsive web design (from concept to sketch to refinement).
  • Utilize best practices in visual design at various screen widths or contextual factors.


  1. Brainstorm what contextual factors could impact the interface.
  2. Define a user.
  3. Storyboard the interaction of the user using the design in each context.
  4. Define the appropriate format/view sizes.
  5. Define content necessary for user to achieve goals.
  6. Organize content via wireframes/sketches.
  7. Begin designing the first view.
  8. Begin designing the second view.