1. SAN JOSE PUBLIC LIBRARY:
CENTER STAGE
VISUALLY GUIDING USERS
Laura Mendiola
Libr. 251
Prof. Kemp

2. DESIGN STRATEGY
• The Pattern: I chose to work on the Services page
for the San Jose Public Library website. I used the
Center Stage pattern described in the Tidwell text
which states: “Put the most important part of the UI
into the largest subsection of the page or window;
cluster secondary tools and content around it in
smaller windows (Tidwell 103).”
• The Reasoning: Users looking under the Services tab
will be looking for their personal and account
information, not library departments. The design
should make that task the main focus of the page.
• Tidwell, J. (2006). Designing Interfaces. (p. 103-6) Sebastopol, CA: O'Reilly Media, Inc.

3. TESTING STRATEGY
• User Task: The tasks I set forth for my testers were:
“Find out if you have any outstanding fines or fees,”
and “Check on the general state of your account.”
• I wanted to recruit users based on computer familiarity and
different ages to emphasize this.
• Task Reasoning: I asked my testers to accomplish
these tasks in this order to ensure that my design
would take users to the information they were
looking for first and foremost, in the most efficient
way possible. Users should not have to guess where
to find information on fines and fees, and my design
should anticipate their task.

4. FIRST SESSION
• Tester #1: Male, 50+ yrs., English/Spanish speaker
• Reasoning: He represents an older user than
myself, who is familiar with computer
processes. He is a bilingual speaker, and
represents minority users who speak English
fluently and are over the age of 50.

5. FIRST SESSION CONT.
• Tester 1 chose the
Late Fees and Lost
Items link.

6. FIRST SESSION CONT.
• Tester 1 was brought to
this page, containing
general information
about fines and fees.
• He clicked on “Check
your account online”
under “Late Fees…”

7. FIRST SESSION CONT.
• Tester 1 was
brought to login
page
• Then Tester 1 saw
he had $0.00 in
unpaid fines in
account and other
account
information.

8. FIRST SESSION CONT.
• End of test interview findings:
• Q: What did you like or not like about the design on the Services
page?
A: I was really frustrated with this. I mean, it was confusing and
the text was way too small. All the links are overwhelming and
they’re misleading!
Q: How do you feel about the way you maneuvered the site?
A: Ugh, I think I did alright. I mean, I got to the information
eventually but, it took me way too long.
• Q: Do you think there is anything that could make the design
better?
A: I liked the expand button option on the side toolbar, I
noticed them on the side there. I think they might help if you
incorporate them in the main design.
Total Time: 4.5 minutes

9. CHANGES #1
• As per Tester 1’s suggestions I decided to take away the link
aspect of the three subcategories under “Your Account”
and replaced them with expand options.
• I also rephrased the titles, and changed “Log Into My
Account” to “Log Into Your Account” to address the user.

10. SECOND SESSION
• Tester #2: Male, 31 years old, English speaker
• Reasoning: This user represents an
advanced computer user and English
speaker. He is a user who should be able to
maneuver the site easily.

11. SECOND SESSION CONT.
• Tester 2 chose to
expand the “Late
Fee & Lost Item
Policies” section,
regardless of the
fact that the
account login
page was the
only link under
“Your Account”
available.

12. SECOND SESSION CONT.
• Tester 2 expanded “Late Fees…” and mentioned the font was too
small, and organized incorrectly.
• He clicked on “My Account” located in the center of the
expanded area.

13. CHANGES #2
• As per Tester 2’s suggestions, I rephrased and
reorganized the information found in the expand
under “Late Fees…” to make it easier to navigate,
more logical and more efficient.

14. SECOND SESSION CONT.
• Tester 2
clicked on the
“My Account”
link under
“Late Fees…”
right away.

15. SECOND SESSION CONT.
• Tester 2 was brought
to the login page.
• Then Tester 2 saw he
had $0.00 in unpaid
fines in account and
other account
information.

16. SECOND SESSION CONT.
• End of test interview findings:
• Q: What did you like or not like about the design on the Services page?
A: I liked that the expand buttons let me see other information without
leaving the page. That was nice. I thought that the Information on
the expand wasn’t that great though, it looked sloppy and
unorganized. But after it was fixed, it looked ten times better.
• Q: How do you feel about the way you maneuvered the site?
A: I felt like I was able to do everything quickly, like that even when I
picked the “wrong” place to start I got to where I wanted to be
quickly.
• Q: Do you think there is anything that could make the design better?
A: No because you asked me to look for one, or two, specific things
but that may not be the case for everyone. So, maybe that
information I clicked on by accident is what someone else is looking
for, and right now it offers something for everyone and it’s not messy.
Total Time: 1.5 minutes (not including time taken for new mockup)

17. CONCLUSION
Based on the two tests run with my paper prototype,
I feel I have come to a compromise between what the
user felt they needed, what they wanted, and my initial
use of the Center Stage pattern. By my last test, the tester
was able to locate their account information quickly and
with virtually no frustration
The point of using the Center Stage pattern was to
ensure that the important information, account
information, was the main focus and easily accessed. In
order to not alienate the needs of other users with other
tasks, this version of the Center Stage pattern focused on
allowing users multiple “right” ways to access their
account information and to complete this task.