{"id":2593,"date":"2022-09-06T19:41:51","date_gmt":"2022-09-06T23:41:51","guid":{"rendered":"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/?p=2593"},"modified":"2022-09-06T19:41:51","modified_gmt":"2022-09-06T23:41:51","slug":"individual-assignment-1-navigating-braceletbook","status":"publish","type":"post","link":"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/?p=2593","title":{"rendered":"Individual Assignment 1: Navigating BraceletBook"},"content":{"rendered":"\n<p>Amy Feinstein<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Exploring BraceletBook<\/h2>\n\n\n\n<p>Lately, I\u2019ve gotten back into making friendship bracelets (they\u2019re a lot more complicated than you might remember from summer camp!). I found a site, <a rel=\"noreferrer noopener\" href=\"https:\/\/www.braceletbook.com\/\" target=\"_blank\">www.braceletbook.com<\/a>, that lets you find friendship bracelet patterns, generate patterns, see photos, watch video tutorials, and participate in a forum. I\u2019ve been spending a fair amount of time on this site recently, and so I asked my friend to take a look and see what she thought.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><a href=\"https:\/\/www.braceletbook.com\/\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"572\" src=\"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/BraceletBook-Home-1024x572.png\" alt=\"\" class=\"wp-image-2595\" srcset=\"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/BraceletBook-Home-1024x572.png 1024w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/BraceletBook-Home-300x168.png 300w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/BraceletBook-Home-768x429.png 768w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/BraceletBook-Home-1536x858.png 1536w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/BraceletBook-Home-2048x1144.png 2048w\" sizes=\"auto, (max-width: 767px) 89vw, (max-width: 1000px) 54vw, (max-width: 1071px) 543px, 580px\" \/><\/a><figcaption>BraceletBook Homepage<\/figcaption><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">The Tester<\/h2>\n\n\n\n<p>My friend describes herself as moderately technically proficient, knowing \u201cjust enough to get by on most websites\u201d but also notes that she knows how to look up anything she is unsure of. Her initial impression of BraceletBook is that it seems like a combination of Pinterest and Instagram. She is familiar with both of those sites and uses them relatively frequently.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Initial Exploration<\/h2>\n\n\n\n<p>Since my friend had not seen or heard of BraceletBook before, I gave her a brief overview while letting her start to explore on her own. The home page shows previews of a few different sections of the site, including Hottest Patterns, Latest Patterns, Latest Photos, and Latest Videos. The first thing she mentioned was that it reminded her of Instagram because many of the patterns showed \u201clikes\u201d underneath the thumbnails. She clicked on a pattern that interested her and immediately noted all the information that showed up at the top of the page \u2013 the dimensions of the pattern, the number of strings required, and the number of colors required. She wondered how to find what colors were needed and then scrolled down and realized that you had to look at the pattern itself to find the colors. I asked her how she would find out if that pattern had a photo attached \u2013 she didn\u2019t see the little camera icon at the top of the page that had a \u201c0\u201d next to it but did scroll down to the bottom of the page, where she thought photos might be based on where she would find them on Amazon. While that is where they show up when they are available, this pattern didn\u2019t have any photos attached (hence the &#8220;0&#8221; at the top).<\/p>\n\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Normal-Knotting-Pattern-2-edited.png\" alt=\"\" class=\"wp-image-2607\" width=\"674\" height=\"409\" srcset=\"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Normal-Knotting-Pattern-2-edited.png 1820w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Normal-Knotting-Pattern-2-edited-300x182.png 300w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Normal-Knotting-Pattern-2-edited-1024x623.png 1024w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Normal-Knotting-Pattern-2-edited-768x467.png 768w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Normal-Knotting-Pattern-2-edited-1536x934.png 1536w\" sizes=\"auto, (max-width: 674px) 100vw, 674px\" \/><figcaption>Colors and knotting instructions for a pattern<\/figcaption><\/figure>\n\n\n\n<p>After looking at that first pattern, my friend started exploring different aspects of the site, from the <a rel=\"noreferrer noopener\" href=\"https:\/\/www.braceletbook.com\/photos\/\" target=\"_blank\">photo page<\/a> to the <a rel=\"noreferrer noopener\" href=\"https:\/\/www.braceletbook.com\/tutorials\/\" target=\"_blank\">tutorial page<\/a> (she liked that the video on the tutorial she picked was embedded) to the <a rel=\"noreferrer noopener\" href=\"https:\/\/www.braceletbook.com\/videos\/\" target=\"_blank\">video page<\/a> (which she discovered also had video tutorials). I then asked her to find a specific pattern by its number, and she clicked on the <a rel=\"noreferrer noopener\" href=\"https:\/\/www.braceletbook.com\/patterns\/\" target=\"_blank\">pattern page<\/a> to search for it, which was the correct path to take. If she had searched directly from the video page, she wouldn\u2019t have been able to find it because there is no video listed for that particular pattern. Because the filter options look the same on each main page except for the title, this isn\u2019t necessarily clear to a novice user. However, she navigated it well.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"291\" src=\"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Filters-1024x291.png\" alt=\"\" class=\"wp-image-2598\" srcset=\"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Filters-1024x291.png 1024w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Filters-300x85.png 300w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Filters-768x218.png 768w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Filters-1536x437.png 1536w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Filters.png 1916w\" sizes=\"auto, (max-width: 767px) 89vw, (max-width: 1000px) 54vw, (max-width: 1071px) 543px, 580px\" \/><figcaption>Filter options on the Patterns page. The filters look the same on all the pages, which makes it confusing to find a specific pattern if you are, for example, on the Tutorials page and the pattern you want doesn&#8217;t have a tutorial.<\/figcaption><\/figure>\n\n\n\n<p>I asked her to do a few more specific tasks on the site to observe her process. I asked her how to tell if specific patterns had photos and\/or videos attached to them, and at that point she was able to find the icons at the top, although it wasn\u2019t until she found a pattern with multiple photos that she noticed the numbers next to the camera and recorder icons. I then tried a more abstract question \u2013 could she find a description of the difference between \u201calpha\u201d and \u201cnormal\u201d style bracelets? She used the keyword search in the patterns, which was a good thought, but it did not get her to the answer. She ended up opening another tab and googling the answer. (For those who are curious, alpha bracelets are more like pixel art and go straight across row by row, where normal bracelets tend to be more geometric in design and have diagonal rows.)<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"alignleft size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Alpha-Pattern-1024x485.png\" alt=\"\" class=\"wp-image-2599\" width=\"718\" height=\"339\" srcset=\"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Alpha-Pattern-1024x485.png 1024w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Alpha-Pattern-300x142.png 300w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Alpha-Pattern-768x364.png 768w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Alpha-Pattern-1536x728.png 1536w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Alpha-Pattern.png 1804w\" sizes=\"auto, (max-width: 718px) 100vw, 718px\" \/><figcaption>Alpha bracelet with keyword tags and bracelet info<\/figcaption><\/figure>\n<\/div>\n\n\n<figure class=\"wp-block-image size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Normal-Pattern-1-1024x446.png\" alt=\"\" class=\"wp-image-2601\" width=\"653\" height=\"284\" srcset=\"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Normal-Pattern-1-1024x446.png 1024w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Normal-Pattern-1-300x131.png 300w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Normal-Pattern-1-768x335.png 768w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Normal-Pattern-1-1536x669.png 1536w, https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/wp-content\/uploads\/2022\/09\/Normal-Pattern-1.png 1839w\" sizes=\"auto, (max-width: 653px) 100vw, 653px\" \/><figcaption>Normal bracelet with keyword tags and bracelet info<\/figcaption><\/figure>\n\n\n\n<p>The trickiest task I had her do on the site was to filter only by alpha or normal patterns. She tried the keyword search at first, but while \u201calpha\u201d is a tag in at least some bracelets, \u201cnormal\u201d rarely is. I eventually gave some hints for her to find the option to filter by type at the top of the page \u2013 most of the other filter options are pretty straightforward, but you have to be at least semi-familiar with bracelet making and the site in order to know to choose that filter.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Novice vs. Expert<\/h2>\n\n\n\n<p>I hesitate to call myself an expert yet on BraceletBook, as I am sure there are features I have still not discovered, but I noticed a difference in ease of navigation between myself and a first-time user (further discussed below under User Interface). One area my friend clicked on that I had never looked at was the social media link section at the top of the page. She clicked on the Facebook link, which opened a pop-up window with an error message. (While typing this up, I just tried it on my own computer and it took me to a link to share the pattern page I was on). She also tried Pinterest, which on her computer just showed a window with the BraceletBook logo and on mine showed the actual pattern. She was using Chrome while I use Firefox (as it turned out, she and I also discovered that the print function worked much better on her browser than on mine).<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">User Interface<\/h2>\n\n\n\n<p>There were several times when the interface hindered my friend\u2019s navigation, most of which I also encountered when I began using the site. For instance, when clicking on videos from the video page rather than the tutorial page, it took her a few tries to exit out of them, as there is no handy \u201cX\u201d at the top of the video. Eventually she managed by clicking far outside of the video screen; I usually exit with the ESC key. Once, she was looking at pictures on the photo page and wanted to navigate to a particular pattern but clicked on the photo thumbnail rather than the pattern number, which just opened the photo. It takes some time to realize that clicking on a <em>pattern <\/em>thumbnail takes you to a pattern, but clicking on a <em>photo <\/em>thumbnail only takes you to that particular photo.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Suggestions for Improvements<\/h2>\n\n\n\n<p>There are several improvements that could be made to help novice users. Both the About section and the FAQs are extremely tiny links at the bottom of the page \u2013 not an unusual place for them to be, but because there is so much information on each page, it takes a lot of scrolling to find them. They should be more prominently featured at the top, which would have made it is easier for my friend to get some of her questions answered. For example, she was wondering what user rankings meant, and the answer is in the first FAQ.<\/p>\n\n\n\n<p>That said, one of the questions I originally asked her, about the difference between alpha and normal patterns, is not specifically answered in the FAQ or the About section \u2013 there is only a link to the general tutorial page. That seems like a big omission for beginning bracelet makers. Another major issue we ran across is the keyword search functionality. My friend noticed a pattern with the Disney character Stitch and clicked on it. Since I am also a fan of that character, I had previously done searches for patterns with Stitch and asked her to do the same. It turns out that when you write \u201cStitch\u201d in the search box you get a lot of irrelevant patterns, since the knots of a bracelet look like stitches for sewing, making it a common tag. Logically, you would think the next step would be to search for both \u201cDisney\u201d and \u201cStitch.\u201d Unfortunately, when you do, the keywords are additive rather than subtractive, and now you get every pattern that is tagged with both \u201cDisney\u201d and \u201cStitch,\u201d and using Boolean operators doesn\u2019t change the results. (Again, for those who are interested, it turns out that you can search for \u201cLilo\u201d and suddenly all the Stitch patterns show up as well.) Adding keywords that filter rather than add extra patterns would be a major improvement to the site. Overall, the site has a lot of great functionality, but a few design tweaks would make it friendlier for both expert and novice users.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Amy Feinstein Exploring BraceletBook Lately, I\u2019ve gotten back into making friendship bracelets (they\u2019re a lot more complicated than you might remember from summer camp!). I found a site, www.braceletbook.com, that lets you find friendship bracelet patterns, generate patterns, see photos, watch video tutorials, and participate in a forum. I\u2019ve been spending a fair amount of &hellip; <\/p>\n<p class=\"link-more\"><a href=\"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/?p=2593\" class=\"more-link\">Continue reading<span class=\"screen-reader-text\"> &#8220;Individual Assignment 1: Navigating BraceletBook&#8221;<\/span><\/a><\/p>\n","protected":false},"author":96,"featured_media":0,"comment_status":"open","ping_status":"","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[3],"tags":[],"class_list":["post-2593","post","type-post","status-publish","format-standard","hentry","category-designing-for-users"],"_links":{"self":[{"href":"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/index.php?rest_route=\/wp\/v2\/posts\/2593","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/index.php?rest_route=\/wp\/v2\/users\/96"}],"replies":[{"embeddable":true,"href":"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2593"}],"version-history":[{"count":22,"href":"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/index.php?rest_route=\/wp\/v2\/posts\/2593\/revisions"}],"predecessor-version":[{"id":3461,"href":"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/index.php?rest_route=\/wp\/v2\/posts\/2593\/revisions\/3461"}],"wp:attachment":[{"href":"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2593"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=2593"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/torch.cci.fsu.edu\/~pmarty\/5275\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=2593"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}