Bütigroove Rhythm of the Heart Music Driven Clothing

Table of Contents

CreativeBrief...... 3 ______...... 6 UserScenarios...... 7 ______...... 9 ForresterReviewTest...... 10 ______...... 11 General-PurposeChecklist...... 11 ______...... 12 CurrentSiteMap...... 13 ______...... 13 RevisedSiteMap...... 14 ______...... 14 Wireframes...... 15 ______...... 17 SiteInteractionEpisodes...... 18 ______...... 20 OurPrimaryGoals&Objectives...... 21

2 CreativeBrief

BUTIGROOVE

Bütigroove is a small local clothing company in Hawaii founded in 2000 by BJ. Their designs are influenced by music; particularly Reggae and Hip Hop. It appeals to people in the urban, club, surfer, and import racer scene.

PRIMARY OBJECTIVE

Our primary objective is to increase the online sales of Bütigroove.com by redesigning its aesthetics and improving the users’ interaction with the website as they browse and shop. We would also like to encourage the users to visit the Bütigroove store and the other stores that carry Bütigroove's products.

TARGET AUDIENCE

Age: Teenagers to young adult Gender: Both Income: Middle-class Education: High school to College Occupation: Anything Computer experience: Basic Spending habits: Reasonable spending. Income from jobs or allowance from parents Special Interests: Hip Hop, Reggae, and Local Hawaiian music, import cars, modeling, clubbing, surfing, urban/street culture Graphic location: Hawaii

3 COMPETITORS

In4mation: http://store.in4mants.com/

Pros Display of multiple pictures for each product Easy navigation through the use of tabs and bread crumbs Use of negative white space to make product images stand out Informative captions for each thumbnail in gallery Option to display desired number of products per page to cater to users connection speed Efficient design layout

Cons Products grouped only by brand, not type (ex. Pants, jackets, etc.) No contact information on homepage No homepage links

4 Island Snow: http://www.islandsnow.com/

Pros Emphasis is on the actual store itself with lots of updated information Great photography Very informative Does a great job promoting its store Successful in its presentation of the company’s identity Quick display of products; when you mouse over thumbnail, larger image of it instantly appears to the right of it

Cons Product Section is weak. Even the larger version images are too small. Product Nomenclature or naming of categories is inconsistent On one of the pages, the background image competes with product image

ASSETS NEEDED

 More men’s products  More consistent product pictures  Business hours  Information on other stores that carry Bütigroove products

EXISTING LOOK AND FEEL

 Geometric and plain. It has an outdated design. The background and foreground is not cohesive.

______

6 UserScenarios

Profile

Name: Marc Fabian Age: 28 Gender: Male Location: Honolulu, Hawaii Education: A.S. in Computer Networking Family: Single Hobbies: Cars, working out, computers, video games Occupation: Informations Analyst & Valet Income: $50,000/Year Computer: PC at home and work Computer Skill Level: Moderate Skills Work hours: 6:30 am to 12 am Disabilities: None

User Goal/Task: Look at the hot wahine pictures.

Site interaction episode

At the splash page, I took sometime wondering which of the two images to click on as it gives no description. I clicked on the left image and found it led to the homepage. Out of curiosity, I pressed back on the browser and clicked on the right image and the same thing happened. I looked at the pictures on the homepage and quickly found the “photos” link at the top navigation bar. When the page popped up, I only saw links which were page numbers. I didn’t know what to expect. I clicked on the first link and a page of photos popped up. Thinking that there were larger versions of each picture, I clicked on them with no results. I wished there were some captions.

7 Profile

Name: Rosalynn Cambe Age: 31 (eek) Gender: female Location: Honolulu Education: Bachelors in Education, Masters in Ed. Tech. Family: Mom, Dad (passed away in 2000), older brother Hobbies: dancing, reading, sleeping (hahahaha), exercising, browsing on the Internet Occupation: enriching young minds (a.k.a. teacher) Income: er, not a lot somewhere in the upper $30,000's Work hours: officially, 7:15-3:00, unofficially, whenever there's work that needs to be done! Disabilities: er, bad eyesight?! Computer: prefer MACs, but constantly surrounded by PCs!!! argh! Computer skill level: I guess intermediate/advanced level?

User Goal/Task: I'd like to learn more about it and the kinds of products it has to offer.

Site Interaction Episode:

The website is nicely organized, but a bit boring. (Hope that doesn’t offend anyone:-D.) It’s cool that they’re selling stuff, but it kinda lost my interest because the site’s not captivating me to wanna stay on it long enough to learn more about it. It needs to be more interesting so that even people who may not have heard of “butigroove” or have an opinion of it will still want to know more about it or pursue through the site because of the graphics and layout of the website. Granted, to me, it just seems to meet the interest of those who already know of it…now, if they wanna reach a larger audience…hmmm???

8 Profile

Name: Brian Briones Age: 31 Gender: Male Location: Honolulu, HI Education: A.S. in Computer Networking Family: Single Hobbies: Computers, videogames, writing, reading Occupation: Internet Technical Support Income: $40,000/Year Computer: PC at home and work, and laptop Work hours: 1pm to 9pm Disabilities: Wears glasses

User Goal/Task: To find out more information about the clothing line and what styles of clothing that is produced by this manufacturer.

Site Interaction Episode:

The site was informative, although very barebones. I suppose this is due to the fact that either the product line is not very diverse in the products offered, but it didn't seem like there was much that I found to be very interesting while visiting the site. In reading some of the information about the company, I found it barebones as well. It seemed as if the website is an afterthought in promoting the product itself and the product line. There basically wasn't much to look at overall once I visited the site, and what I found there was very little in detail or seemed incomplete. ______

9 ForresterReviewTest

Objectively assess Web site usability, and identify interface flaws that may be stopping your users from reaching their goals

Forrester's Web Site Review Program provides you with an action-oriented, research-based assessment of your Web site; as well as the opportunity to review your competitors' sites.

SUMMARY Value 1. Is essential content available? 1 2. Is essential function available? 1 Subtotal 2 Navigation 3. Do menu categories effectively set user expectations? -1 4. Do menu categories expose or describe their subcategories? 2 5. Is the site menu structure flat? 1 6. Do site menus provide multiple paths to critical content or function? 1 7. Are keyword-based searches comprehensive and precise? -2 8. Does search present results in a useful interface? -1 9. Is the site accessible to the physically impaired? 1 10. Is the site accessible to the visually impaired and hearing impaired? -1 Subtotal 0 Presentation 11. Does the site use language that's easily understood by target users? -1 12. Does the site use graphics, icons, and symbols that are easily understood by target users? 1 13. Is text legible? 2 14. Are navigation elements easily recognizable at a glance? -1 15. Do page layouts use space effectively? 1 16. Are controls, settings, and data fields presented in a logical order? 1 17. Do pages provide location cues? -1 18. Are interface elements consistent? 1 Subtotal 3 Trust

10 19. Is contextual help available at key decision points? 0 20. Does the site explain how personal data is kept secure? -1 21. Do users have control of their personal data? -1 22. Is the site consistently fast? 2 23. Is the site reliable? 1 24. Does the site recover well from errors? -1 25. Does site functionality give feedback? 1 Subtotal 1 Total Score 6 range: -50 to +50

______

General-PurposeChecklist

Architecture and Navigation Is the navigation scheme clear? Are navbar choices logically ordered? Do link names match page names? Are links clearly visible? Are there indications of where you are? Are there multiple ways of browsing/searching the site?

Layout and Design Does page size exceed window size? Is layout consistent between pages? Is there a clear focal point on each page? Does the layout work visually? Is there good contrast? Is the layout cluttered? Is it aesthetically pleasing?

Content Is the text clear and concise? Is text organized in small chunks? Are there spelling or grammar errors?

Forms and Interaction Are dialogue methods concise and consistent? Are elements grouped properly?

Graphics Is image quality adequate?

11 Are images stored for maximum compression?

Color Is the choice of colors appropriate for site? Are too many colors used? Are colors used consistently? Are graphics colors dithered? Do color choices work in grayscale?

Typography Is the text legible? Is the font size large enough? Is the font color appropriate and is there sufficient contrast? Are there sufficient margins? Are typefaces used properly and consistently?

Platform and Implementation Is load-time fast enough? Does it load in 3 to 15 seconds?

______

12 CurrentSiteMap

______

13 RevisedSiteMap

______

14 Wireframes

15 16 ______

17 SiteInteractionEpisodes

Profile

User Goal/Task: Marc just wants to look at the photo gallery.

Site interaction episode

After going to several import car shows this year, Marc notices that a quite a bit of guys and models were wearing Bütigroove shirts and shorts. Mostly interested in looking at pictures of the models, he searches for Bütigroove online. As soon as he finds the website, he looks for a picture gallery link which he easily finds in the left sub navigation. He clicks on it and finds labeled photo albums, one of which was named “Bütigirls” with a thumbnail of a model. “Bingo!”, exclaims Marc. At the bottom of the page, he reads a statement saying, “Send us pics of yourself wearing Bütigroove and we’ll post them here!” He bookmarks the page to check back on it from time to time. He browses the other photo albums and sees a particular shirt a DJ is wearing that he thinks looks cool so he looks for it in the Men’s section and decides to purchase it.

18 Profile

User Goal/Task: Rosalyn wants to buy a shirt she saw someone wear as a gift for her boyfriend.

Site Interaction Episode:

Rosalyn finds the Butigroove website through Google. The homepage grabs her attention with its stylish graphics and images of people wearing the Bütigroove shirts. She quickly finds the "Men's" link button at the top, clicks on it, and browses through the products gallery. Unfortunately, she doesn't find what she was looking for. However, while browsing through the wealth of selections, she finds two she thought her boyfriend would like. Before she orders them, she remembers the images of models wearing tops she thought were cute so she decides to check out the Women's gallery and orders a tank-top for herself.

19 Profile

User Goal/Task: Brian wants to find out more information about the clothing line and what styles of clothing that is produced by this manufacturer.

Site Interaction Episode:

Brian finds the Bütigroove website through Google. At the homepage, he immediately gets an idea of Bütigroove’s clothing style based on the pictures and graphic design. He clicks on the “Men’s” link at the top and browses the t-shirts. He really likes a lot of the t-shirt designs he sees. He then locates the “About Us” link in the sub navigation to the left. He finds thorough information about Bütigroove with images that help to visually illustrate the culture that Bütigroove is identified with. This is his scene. He takes down the address and store hours he finds under the sub navigation and plans to visit the store on the weekend.

______

20 OurPrimaryGoals&Objectives

We at Derick Designs want to see your business grow online; and we will do this by:

1. Redesigning the aesthetics of Bütigroove.com A. We will attract more users to the site and keep them coming back. B. We will make them feel confident and secure in ordering online. 2. Improving the users’ browsing and shopping experience A. We will make browsing the website a smooth ride by organizing the information so that the user will know exactly what to do and where to go to get what they want. B. We will showcase more of your products in a more visually interesting presentation.

In addition to improving your online business, we will help increase your in-store sales by highlighting the Bütigroove store and the other stores that carry Bütigroove products.

Thank you for giving us this opportunity to show you how we can help make Bütigroove a more successful business.