About 45 minutes
Web design patterns are frequently-implemented frontend features. They solve recurring user experiences challenges in a seamless way. Web developers need to know what web design patterns exist so they can create effective user experiences.
Participants will be able to:
Web Design Patterns (video walkthrough of slides)
No pairs will be assigned for this activity. On your own, visit at least 5 websites and make note of which, if any, design patterns are used on each website. Some suggestions to get you started are provided below, but feel free to visit any website that would be appropriate.
Now that you have seen what a variety of web design patterns look like, choose 3 which seem the most useful or the most interesting. Given what you know about programming logic, HTML and CSS at this point, write down (in plain language, not code) the steps you might take to implement each of these 3 web design patterns. For example:
“The pop-up calendar that appears when a user clicks on a form field to select a date is really convenient. I’ve used these a lot in the past. If I were to implement a feature like this, I’d somehow need to get all the dates to line up in rows, and each date would need to be a link. I’d need to have arrows to go back and forward in time, and those arrows would need to be links to. I’d have to make the calendar appear only when the form field is clicked on.” (and so on…)
Form small groups and discuss: