Fluid Design Pattern Library
Allison Bloodworth
9/27/07
What is a pattern?
A pattern is a proven solution to a common
problem in a specified context
There may be many different im...
Software Engineering Patterns
Organization

People
• Pedagogical Patterns
(Manns, 1996)

• Organizational
Patterns
(Coplie...
Patterns are useful for:
Gathering best practices in user-centered
design (UCD)
UCD pattern catalogues carry a significant
...
Pattern Libraries - Tidwell

http://www.time-tripper.com/uipatterns/
Pattern Libraries - van Welie

http://www.welie.com/patterns/index.php
Pattern Libraries - Yahoo!

http://developer.yahoo.com/ypatterns/
Pattern Libraries - UC Berkeley

http://harbinger.sims.berkeley.edu/ui_desig
Pattern Libraries - Moudil
Pattern Library Organization
Models - Patrick Stapleton
Subject
Content - normally specify an application genre like
ecomm...
Pattern Library Organization
Models - P. Stapleton
Level
1. Information architecture –navigation of
content within an appl...
Pattern Library Organization
Models - UPADE
Pattern Library Issues
Proper granularity for a pattern
Serve one organization or many/all?
Use classification hierarchies ...
Advice on creating a pattern
library
First of all, read all the articles and books etc.
related to this topic to get start...
Questions about Fluid Design
Patterns
How can patterns add value to the Fluid
community?
What do we mean by “design patter...
Questions about Fluid Design
Patterns
Is the package we want to provide more than just
design patterns?
Patterns, style gu...
Oracle s Enterprise Pattern
Exchange Proposal
The Enterprise Pattern Exchange (EPE) is an ambitious
project, which aspires...
More Pattern Resources
Yahoo! UI Patterns Authors mailing list:
http://tech.groups.yahoo.com/group/uipattern-authors/
The ...
Upcoming SlideShare
Loading in …5
×

Fluid Design Pattern Library

2,116 views

Published on

Presented by Allison Bloodworth at the Fluid Project Summit on September 28, 2007

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
2,116
On SlideShare
0
From Embeds
0
Number of Embeds
56
Actions
Shares
0
Downloads
7
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Fluid Design Pattern Library

  1. 1. Fluid Design Pattern Library Allison Bloodworth 9/27/07
  2. 2. What is a pattern? A pattern is a proven solution to a common problem in a specified context There may be many different implementations of each pattern “Each pattern is a three-part rule, which expresses a relation between a certain context, a problem, and a solution” [Alexander 1979].
  3. 3. Software Engineering Patterns Organization People • Pedagogical Patterns (Manns, 1996) • Organizational Patterns (Coplien, 1998, Cockburn, 1997) • Business Reengineering Patterns (Beedle, 1997) Process • Human-to-Human Product Communication Patterns (Cockburn, 1997) • HCI Patterns (Tidwell, 1998) • Steps and Task Patterns (Ambler, 1998; Coplien, 1995) • Software Design Patterns (Gamma, 1995) • Process Improvement Patterns (Appleton, 1997) From: Maximizing Reusability of Pattern Languages over the Web, Homa Javahery, www.cusec.net/archives/2002/javahery.ppt
  4. 4. Patterns are useful for: Gathering best practices in user-centered design (UCD) UCD pattern catalogues carry a significant amount of reusable design knowledge Educating software engineers, who are the individuals that make most of design decisions which affect usability Facilitating communication among software engineers Adapted from Pattern Framework for Eliciting and Delivering UCD Knowledge and Practices, A. Gaffar, H. Javahery, A. Seffah, D. Sinnig, presentation at HCI International 2003, http://dsinnig.com/ppts/Pattern.ppt
  5. 5. Pattern Libraries - Tidwell http://www.time-tripper.com/uipatterns/
  6. 6. Pattern Libraries - van Welie http://www.welie.com/patterns/index.php
  7. 7. Pattern Libraries - Yahoo! http://developer.yahoo.com/ypatterns/
  8. 8. Pattern Libraries - UC Berkeley http://harbinger.sims.berkeley.edu/ui_desig
  9. 9. Pattern Libraries - Moudil
  10. 10. Pattern Library Organization Models - Patrick Stapleton Subject Content - normally specify an application genre like ecommerce and supply chain management. • E.g. in the Design of Sites collection under "Site Genres" and in Welie s collection under "Site Types". Functional - based on logical breakup of functionality • E.g. shopping cart and two-panel selector. This seems to be the most common prevalent classification type, found in many popular libraries Client - the platform on which a UI pattern has been design to operate. From ui-patterns-authors mailing list
  11. 11. Pattern Library Organization Models - P. Stapleton Level 1. Information architecture –navigation of content within an application 2. Screen architecture – positioning of functionality and content within a screen 3. Site furniture – the formatting of functionality and content From ui-patterns-authors mailing list
  12. 12. Pattern Library Organization Models - UPADE
  13. 13. Pattern Library Issues Proper granularity for a pattern Serve one organization or many/all? Use classification hierarchies or tags? Use mark-up language to facilitate reuse (e.g. PLML)?
  14. 14. Advice on creating a pattern library First of all, read all the articles and books etc. related to this topic to get started. Second, it is really important to understand organization's culture to select suitable patterns and create tool for sharing and managing patterns. And, when you have created the library, you need to find the ways to keep the library living. From ui-patterns-authors mailing list
  15. 15. Questions about Fluid Design Patterns How can patterns add value to the Fluid community? What do we mean by “design patterns”? Who is our audience? Programmers, UX Designers, Jr. UX Designers Individual Fluid apps, all Fluid apps, other university websites & applications, all websites & applications What do our target users need? What is our scope? Design patterns related to components, any design patterns relevant to Fluid applications
  16. 16. Questions about Fluid Design Patterns Is the package we want to provide more than just design patterns? Patterns, style guide, component code, component implementation instructions (design & technical) How do we want to present the information? Wiki, Content Management system How can we help our target users find what they need? Indexing, search, tags, dynamic generation of examples for each application How does the Fluid DP library relate to/borrow from other DP libraries? What value do we add? How can we ensure the Fluid DP library remains relevant/lives on?
  17. 17. Oracle s Enterprise Pattern Exchange Proposal The Enterprise Pattern Exchange (EPE) is an ambitious project, which aspires to become the major online UI Pattern resource for pattern writers and user alike. Proposed Features The most comprehensive collection of patterns publicly available online to date (Oracle, Yahoo, eBay and Tidwell) Discussion threads for all patterns (including RSS feed generation) Pattern submit tool Search tools Role based access for patter writers, users and assessors Distributed pattern management tools Pattern usage statistics From “Developing a UI Pattern Standard,” Patrick Stapleton, Oracle
  18. 18. More Pattern Resources Yahoo! UI Patterns Authors mailing list: http://tech.groups.yahoo.com/group/uipattern-authors/ The Pattern Gallery: http://www.cs.kent.ac.uk/people/staff/saf/ patterns/gallery.html

×