1.
Web Design Pattern Library www.ui-designpatterns.org Kelly Snow, Mano Marks, Tim Dennis, Dave Hong May 12, 2006 U.C. Berkeley Web Design Patterns Library

2.
UC Berkeley Environment <ul><li>Autonomous fiefdoms </li></ul><ul><li>Lack of coordinated development efforts. </li></ul><ul><li>Applications based on organizational structure </li></ul><ul><li>Different strategies and code base </li></ul><ul><li>Top-down initiatives are doomed </li></ul>May 12, 2006 U.C. Berkeley Web Design Patterns Library

3.
UI Design at UC Berkeley <ul><li>No formal training </li></ul><ul><li>Work in isolation </li></ul><ul><li>Few resources / many responsibilities </li></ul><ul><li>No sense of community </li></ul><ul><li>Developers with non-technical managers </li></ul>May 12, 2006 U.C. Berkeley Web Design Patterns Library

4.
Sakai <ul><li>Many cooks in the kitchen </li></ul><ul><li>Distributed and disparate development environments </li></ul><ul><li>Unique branding for each campus </li></ul>May 12, 2006 U.C. Berkeley Web Design Patterns Library

5.
Collaborative Tools <ul><li>Working groups </li></ul><ul><li>Discussion groups </li></ul><ul><li>Email </li></ul><ul><li>Wiki </li></ul>May 12, 2006 U.C. Berkeley Web Design Patterns Library

6.
Common Solutions <ul><li>Templates </li></ul><ul><li>Hi-fi Wireframes </li></ul><ul><li>Tags / Markup </li></ul><ul><li>Styleguides </li></ul><ul><li>“ Top-down Smackdown” </li></ul>May 12, 2006 U.C. Berkeley Web Design Patterns Library

7.
Distributed Knowledge <ul><ul><li>“ knowledge about user interface and design is distributed and often not shared” </li></ul></ul>May 12, 2006 U.C. Berkeley Web Design Patterns Library

8.
Inconsistency <ul><ul><li>“ knowledge about what constitutes good user interface is inconsistent” </li></ul></ul>May 12, 2006 U.C. Berkeley Web Design Patterns Library

9.
Personalities <ul><ul><li>“ each person has their own ideas and agenda about the interface” </li></ul></ul>May 12, 2006 U.C. Berkeley Web Design Patterns Library

10.
Web Design Patterns <ul><li>A model for common problems and appropriate solutions in highly diverse development environments. </li></ul><ul><li>Provide a common language for people to use in their work process. </li></ul>May 12, 2006 U.C. Berkeley Web Design Patterns Library

11.
Why Design Patterns? <ul><li>Collect and redistribute knowledge of large communities. </li></ul>May 12, 2006 U.C. Berkeley Web Design Patterns Library

12.
Why Design Patterns? <ul><li>Cooperative & inclusive: </li></ul><ul><li>a better model and artifact for attaining and capturing consensus. </li></ul>May 12, 2006 U.C. Berkeley Web Design Patterns Library

13.
Why Design Patterns? <ul><li>Encapsulate rationale and best practices as well as shared interests </li></ul>May 12, 2006 U.C. Berkeley Web Design Patterns Library

14.
Why Design Patterns? <ul><li>Combine a heavy text-based medium with visual examples </li></ul>May 12, 2006 U.C. Berkeley Web Design Patterns Library

15.
Why Design Patterns? <ul><li>Describe design elements allowing for flexible implementation and mixing and matching </li></ul>May 12, 2006 U.C. Berkeley Web Design Patterns Library

16.
What We Built <ul><li>Web-based application that contains web design patterns </li></ul><ul><li>Pattern schema </li></ul><ul><li>Supports contributions from UC developer community </li></ul>May 12, 2006 U.C. Berkeley Web Design Patterns Library

17.
How We Did It <ul><li>Surveying and interviewing users </li></ul><ul><li>Analysis of other pattern collections </li></ul><ul><li>Analysis of existing campus apps </li></ul><ul><li>Data Modeling </li></ul><ul><li>Pattern Writing Methodology </li></ul><ul><li>User Centered Design </li></ul><ul><li>Implementation </li></ul>May 12, 2006 U.C. Berkeley Web Design Patterns Library