Teresa Ovalle

Welcome to Me

Wireframe and Rationale for Mr. Bottles

on December 17, 2014

Three students chose the Mr. Bottles website as an assignment site to work for a number of our assignments. The wireframe and the rationale below are both related to the Mr. Bottles website assignment.

Ovalle_Home Page copy

Ovalle_Appraisals copy

NOTE: The format changed from the original format to WordPress.

Rationale for Wireframe

1. Objective

To explain the rationale behind the suggestions for the wireframe of the new Home Page as well as the new Appraisals page.

2. Home Page

The Mr. Bottles Home Page is cluttered and is difficult to navigate due to the lack of navigational aids. The suggested wireframe – details below – is intended to help the visitor more easily find her way through the site so she can find what she is looking for and doesn’t have to guess where the navigation tools are located.
The usability tests showed that the website was very cluttered and needed to be cleaned up. The tests also showed that the navigational aids were difficult to locate. The new wireframe cleans up the website and puts into place a navigational system that offers easy-to-use features for the visitor.

a. Logo

1. Current:

i. There is no logo. If there were, it might not be discernable because of the clutter of the website.

2. Changed:

i. The logo is now in its proper place at the upper left-side of the screen. It also transcends all pages.

b. Social Media Buttons

1. Current:

i. There are not social media buttons.

2. Changed:

i. Social media buttons have been added to the top of the website to show which mediums are managed by Mr. Bottles. The buttons transcend all pages to ensure the visitor has the ability to join the conversation of her choice during her visit.

c. FAQ

1. Current:

i. The FAQ is hidden in poorly placed navigational aids. It is difficult to find.

2. Changed:

i. The FAQ button is now placed at the top of the page, above the search bar. This facilitates an easy-to-find button that transcends all pages.

d. Search

1. Current:

i. The Search button is located at the top right of the page. This is a good location and the button transcends all pages.

2. Changed:

i. There were not changes to the Search button.

e. About Us, Join the Fun and Learn More

1. Current:

i. None of the tabs exist.

2. Changed:

i. The About Us tab is first and foremost in the line-up of tabs to invited the visitor in to learn more about the organization.

ii. The Join the Fun tab is also prominent on the main tab line-up. This tab opens up a number of interesting tabs and pages, such as Events, Bottle Talk Forum and the Hall of Fame.

iii. The Learn More transcends a couple of the other pages to help the visitor more easily find what she is looking for.

f. Contact Us

1. Current:

i. The Contact Us button can be found, but it’s not located in a traditional place, so it can be difficult to find.

2. Changed:

i. The Contact Us button is now in a prominent place at the top of the page and transcends all pages to ensure the visitor can come back home regardless of how far she is clicked in.

g. Find Your Bottle

1. Current:

i. The visitor can look through a number of similar bottles on the left column to locate her similar bottle, but nothing suggests the that visitor can click on the icon to view her bottle.

2. Changed:

i. Now the Find Your Bottle icon is located at the top of the left-side navigation, right under the logo. When the visitor clicks on the icon, an entire list of bottle icons will open for her research.

h. Appraisals

1. Current:

i. It is difficult to find the appraisal buttons. There are actual two buttons to click on, both of which are not easy to find.

2. Changed:

i. The Appraisals button is now located on the left-hand side of the navigation bar, under the Find Your Bottle button. This is a logical place for the button, it can be easily found and the visitor knows that it can be clicked on and opened for further research.

i. Bottle Talk Forum

1. Current:

i. This button used to be hidden in the depths of the website within the Of Interest menu. It was difficult to find.

2. Changed:

i. The button, with photo, now sits under the Welcome to Mr. Bottles headlines and paragraph. It sits above the fold, so the visitor can easily find it upon her first visit to the website.

j. Bottle Cleaning

1. Current:

i. There is one icon on the current site, but it’s not clear as to whether it’s clickable or not, so people may simply by-pass it, looking for another icon.

2. Changed:

i. The button, with photo, now sits under the Welcome to Mr. Bottles headlines and paragraph. It sits above the fold, so the visitor can easily find it upon her first visit to the website.

k. Events

1. Current:

i. The Events button was also hidden from view of the visitor in the Of Interest menu. Events should stand prominent on the website to share what is going on with the organization.

2. Changed:

i. The button, with photo, now sits under the Welcome to Mr. Bottles headlines and paragraph. It sits above the fold, so the visitor can easily find it upon her first visit to the website.

l. Site Map

1. Current:

i. There is currently no site map.

2. Changed:

i. A site map transcends all pages of the website to ensure the visitor can easily navigate to anywhere see needs to go.

3. Appraisals

The usability tests proved that the current Appraisals page was a mess. It was cluttered and stacked with outdated and useless information. The Appraisals page now functional and easy to navigate.

a. Buttons that carry over from the Home Page include: Logo, Social Media buttons, FAQ, Search, Contact Us, Learn More, Find Your Bottle, Bottle Cleaning and the Site Map.

b. Home

1. Current:

i. The Home button on all pages was difficult to find.

2. Changed:

i. The Home button is now displayed prominently at the top of the page.

c. eBay Logo and link

1. Current:

i. There is no eBay logo or link on the current Appraisals page. There are several old and outdated photos of eBay pages, but nothing that links the visitor to eBay to find similar bottles.

2. Changed:

i. The eBay logo can be clicked on to lead the visitor to eBay to find similar bottles of value.

d. Hall of Fame

1. Current:

i. The Hall of Fame button is hidden in the Of Interest menu of the semi-hidden navigation bar.

2. Changed:

i. The Hall of Fame photo and link are now prominently displayed to encourage the visitor to click on the link and learn how many others have found great valued bottles.

In summary, a wireframe shows how the buttons should appear on the screen and it also helps the designer to understand the interface between the pages and their buttons. By redoing the website as described above, the Mr. Bottles website will be functional for the visitor and will prompt the visitor to click on different buttons out of curiosity – because she can now find those buttons there were once so well hidden.