Client: Dean Michael Shaughnessy

Project: Increase usability and organi-

zation of the W&J Summer program

website, with a long-term goal of

improving upon current registration

rates.

Dear Dean Shaughnessy,

Contained in the following pages is

research I have found that would assist in

making the W&J Summer site more user-

friendly. After the research, I provide

examples of what other schools do well

and explain some of the features that make

them effective. My hope is that after you

read the document it will inspire you to

examine the site more closely and enable

you to make any changes you deem appro-

priate to creating a better user experience.

Best,

Andy McKenna

How Do Users Think?

Users appreciate quality and credibility.1If a page provides users with high-quality content, they are willing to compromise the content with adver-

tisements and the design of the site. This is the reason why not-that-well-designed web-sites with high-

quality content gain a lot of traffic over years. Content is more important than the design which supports

it.

Users don’t read, they scan. Analyzing a web-page, users search for some fixed points or anchors which would guide them through the

content of the page.

Eye tracking studies conducted by Jakob Nielsen show that users read content that resembles an F shape, meaning that the reading starts from the upper left of the web page, next it moves down a little starting from the left again.

1. I did research on other sites, but this list from Smashing Magazine ended up being the most comprehensive of the information I gathered:http://uxdesign.smashingmagazine.com/2008/01/31/10-principles-of-effective-web-design/

The eye tracking scans are from: http://www.nngroup.com/articles/f-shaped-pattern-reading-web-content/

2

Web users are impatient and insist on instant gratification.Very simple principle: If a web-site isn’t

able to meet users’ expectations, then

designer failed to get his job done prop-

erly and the company loses money. The

higher is the cognitive load and the less

intuitive is the navigation, the more

willing are users to leave the web-site

and search for alternatives.

Users don’t make optimal choicesUsers don’t search for the quickest way

to find the information they’re looking

for. Neither do they scan web-page in a

linear fashion, going sequentially from

one site section to another one. Instead

users satisfice; they choose the first rea-

sonable option. As soon as they find a

link that seems like it might lead to the

goal, there is a very good chance that it

will be immediately clicked. Optimizing

is hard, and it takes a long time. Satisfic-

ing is more efficient.

Both pictures show: sequential reading flow doesn’t work in the Web. Right screen-shot on the image at the bottom describes the scanpath of a given page.

3

Users follow their intuition. In most cases users muddle through

instead of reading the information a

designer has provided. According to

Steve Krug, the basic reason for that is

that users don’t care. “If we find some-

thing that works, we stick to it. It doesn’t

matter to us if we understand how

things work, as long as we can use them.

If your audience is going to act like

you’re designing billboards, then design

great billboards.

Users want to have control. Users want to be able to control their

browser and rely on the consistent data

presentation throughout the site. E.g.

they don’t want new windows popping

up unexpectedly and they want to be

able to get back with a “Back”-button to

the site they’ve been before: therefore it’s

a good practice to never open links in

new browser windows.

4

More organized than most local competition2

Compared to sites like Pitt and Duquesne,

W&J’s Summer site actually makes it

easier to find appropriate information.

Not in terms of streamlined links, but in

terms of being generally accessible and

easy to navigate.

Links are mostly usefulThe links in the side bar are appropriate

and lead to things that are useful. The

news box could be tweaked, but that may

change as content is added.

Consistent with overall site designThis is something that CMU and Pitt

don’t do particularly well. Their Summer

school sites are literally different site, and

don’t feel official. The W&J site is inte-

grated well enough with the overall

design to look official and be consistent

with the user experience.

2. For research, I used: Pitt, Duquesne, CCAC, RMU, Cal U, IUP, Slippery Rock, CMU, Carlow, PSU, St. Vincent

5

SimplifyOverall, the biggest thing the site could do

better is to actually do less. It’s trying to

be too many things instead of just assisting

the user in what they want to do. One of

the best things that art sites3

do really well

is to keep the simple and allow the users to

control their experience more easily.

Smaller info blurbs - avoid wallsThe site has a wall of text in the informa-

tion section. Given the way people scan,

they may never find information they

need, so things need to be done to separate

the information and the copy in a logical

way.

Link to WebAdvisor and CatalogThe site currently doesn’t link to WebAdvi-

sor or the Catalog, both of which would be

very usefull and that even Pitt does on

their site.

3. For research, I used: The Pratt Institue, RIT, RISD, CalArts, The Parsons School, The Standord D-School

Integrate with full siteThe Summer page needs to be part of the

site. I spent a lot of time just trying to find

the Summer site from W&J’s main page,

and had to google it to find the site.

Keep clicks downPeople talk about the number of clicks a

lot. Some believe it’s vital and some

believe it doesn’t mattter as long as the

design is good. I prefer the idea that users

are impatient and irrational, as the Smash-

ing Article writer says. The site really

should be optimized to assist users quickly

and efficiently, and it can still be “pretty”

at the same time.

The D-School is an extreme case, where

they literally have a registration link in

your face. But other schools like The Pratt

Institute and RISD use links that follow a

logical pattern that people will hopefully

follow. For me that was effective, and it

was generally the same pattern on other

sites.

6

[I recommend zooming in for for these next few]

Stanford D.School4

The D.School is one of my favorites and is

perfect for the idea of keeping things

simple. The design is nice, very visual,

but at the same time it is optimized and

direct so the user can find what they need

quickly.

The Parsons School5

This site also works well because it keeps

things mostly simple. The multi-column

design can be consusing for users since

many are not used to that format, but the

left hand side dedicates a lot of space to

the navigation and finding the Summer

program is very simple and follows a

logical pattern.

An added bonus is the enormous link to

the course catalog and the links to regis-

tration being in the same area.

4. dschool.stanford.edu5. www.newschool.edu/parsons 7

CalArts6

CalArts effectively promotes the Summer

school itself on its home page. W&J kind

of does this, but the problem is the put the

self-provided ad BELOW the fold of the

page (where the page ends on a computer

screen). If you want people to click on

something, it needs to be in the naviga-

tion bar on the left hand side or above the

fold.

Once the user gets to the Summer page,

everything is organized and, more impor-

tantly, separated by headers logically with

multiple font weights to help the user

scan the information.

6. www.CalArts.edu 8

Rochester Institute of Technology7

RIT’s design is really bland and some-

times a pain to use, but the one thing that

it does really well is use the “bread-

crumb” technique. The breadcrumb tech-

nique is where the design incorporates the

steps taken to reach the page the user is

currently on. This is especially effective

on pages like RIT’s, where it will take

more than two clicks to get anywhere.

For example, when you look at the final

course description at the bottom on RIT’s

registration catalog, there is a breadcrumb

feature at the beginning that will allow

them to get anywhere else they might

need to go within that particular disci-

pline.

7. www.RIT.edu 9

Rhode Island School of Design8

RISD was one of the schools I initially

hoped would be perfect for this presenta-

tion and it ended up being true. All the

links follow a logical order, the informa-

tion blurbs are optimized for scannings,

and once a user gets to the Summer site it

is well-organized with headers and the

navigation is appropriate and useful.

My favorite thing might be how the text is

separated. Not only is it an easy read on

my screen, the weights of the text allow a

user who is scanning for information to

quickly find what they need or, if they

don’t know, to identify it just in the same

amount of time. As with the D-School,

Parsons, and CalArts, the clicks are kept

to a minimum.

8. RISD.edu 10

Pratt Institute9

The Pratt Institute might be my favorite

for logical navigation. The Summer pro-

gram is listed under the Academics tab

and once the user is there it’s very smooth

sailing. Like RISD, they make effective

use of different font weights to help orga-

nize. They also utilize the breadcrumb

technique on the left-side navigation and

use their designated space on the right to

let users connect on social media, sched-

ule visits, and register.

So once again, the site is organized effec-

tively, the important information is

divided appropriately, and links are both

visible and useful.

9. www.Pratt.edu 11