Ravelry Website (Good Design)

Ravelry is a multipurpose, user-driven site for knitters and crocheters. It is part social

ravelry.com when not logged in
ravelry.com when not logged in

networking, part immense pattern library. My use of it over the past 7 or so years has been primarily in pattern searching, but the site design, which is good by many of Norman’s principles, has not changed in that time.

The most important constraint used by Ravelry is “physical” (can the digital be physical? Yes… probably?). Ravelry requires users to have a free account to access the materials on the site. Instead of entering the site, finding a pattern, and coming up against a wall of “you must be a member to view,” which is terribly common on knitting pattern sites, Ravelry demands that you login or create a free account before you can even see the home page.

 

Screen Shot 2015-02-04 at 7.27.17 PM

Screen Shot 2015-02-04 at 7.37.06 PM

The menu bar on the homepage is a great example of visibility because the major controls of the site are immediately apparent. The menu is well mapped, as the options are clearly labeled, so the user knows where to go, and styled like individual buttons (an affordance), so the user knows how to get there. The buttons give immediate feedback as to which you are mousing over, and potentially about to click, as their backgrounds turn white when hovered over. Hovering over “My Notebook” activates a drop down menu that shows every item in that category, giving visibility to the places where the user saves their own content.

 

Screen Shot 2015-02-04 at 7.39.36 PM
Pattern Library

 

The pattern library is a clear instance of good visibility (what I believe, of all of Norman’s concepts, is Ravelry’s overwhelming strength of design). It immediately shows that the library is searchable. It makes it apparent that the user can choose to see either knitting or crochet patterns or both. It shows different popular project categories, but also shows that there are many more categories. There are good affordances because all links are underlined, good feedback because when the user rolls over the link it is highlighted, and good mapping because the labels are all unambiguous.

Screen Shot 2015-02-04 at 7.49.52 PM
Example from Advanced Search

Doing an advanced search for patterns (just two quick clicks from the page above) yields the same comments, but also has good visibility for the ability to select more than one filter in each category, by way of including check boxes.

The actual pattern page gives a lot of information about the pattern, but alsoScreen Shot 2015-02-04 at 7.56.34 PM gives good visibility to the user engagement aspects of the site on the upper right. These options have good affordances in particular because they include actions in the descriptions. The user knows if they want to “add to library” they click that area and their wish is the site’s command.


While I have never thought Ravelry was particularly beautiful (and I am unceasingly frustrated that they do not have an app), it certainly is designed well enough according to Norman’s principles for even the cliche knitting granny to find a pattern.