Ux examples

WIREFRAMING AND
PROTOTYPING

Wireframes created through HTML prototypes, Omnigrafﬂe,
Visio, and Axure

“What’s On” - Gig guide around major Australian cities

Asciano - very conservative, focus on share price and
showcasing upcoming plans

Click Foundation - Not for proﬁt organisation, focus on
acquiring donations and volunteer work

Gatorade Replay - Gatorade video competition

BFB_wireframeV05:: Reviews

Log on to My Optus Account

Business Mobiles Mobile Broadband & Tablets Internet Ofﬁce Phone Bundles MyBiz Blog

Log on to MyBiz 0 items

Overview Features and Beniﬁts Reviews

Product screenshot

Buy [Product]

RHS

Plans and Pricing

$49 $29 $19
per month per month per month

Add to cart Add to cart Add to cart
60 Users 20 Users 5 Users
25 GB Storage 10 GB Storage 5 GB Storage
Feature X Feature X Feature Z
Feature Y Feature Y
Feature Z more info

more info more info

Footer

Optus MyBiz - Product review, plans and pricing

CONTEXTUAL INQUIRIES

Including the creation of
Afﬁnity Diagrams, Personas and Findings Report

5 Allow people to vote on ﬂavourful tips

Person
clicks on
"like"

screenshot - zoom
into section of "like"

Is the
person Yes
logged in?

Are they
using
Facebook
connect? Yes
No
Publish to
No
Facebook
stream

Vote
number
goes up

screenshot - screenshot -
zoomed into zoomed into
refreshes instantaneously
previous number of updated number of
votes votes

"Like" button
Are they
changes to If person Yes Publish to
using
"Undo". decides to Facebook
Facebook
Options to log log in stream
connect?
in appear.

No

Person is screenshot - zoom
logged into into logged in
the site status

Masterfoods’ Favourful Tips -
Facebook “Like” social media integration

BFB_wireframeV05:: Shopping interaction

Notes for shopping process

- omit unnecessary steps from the order process
Add to shopping in the navigation, and add the pages that the user
Cart sees.

- selling add-ons/extras should be done after the
customer has bought the item. Optus are losing
sales otherwise.

- omit unnecessarily distractions during the
checkout process such as "$0 upfront only", "Not a
business customer" and "Free delivery for online
orders". These links take the customer away from
Item gets added to
paying Optus money.
shopping cart
- There is no need to link back to the shopping cart
Show shopping cart
with the checkout button once the customer is
(current system -
already in the checkout process.
summary view).
Rename this page to
- There are multiple places where there is no
shopping cart
distinct/primary call to action. eg summary page
"continue shopping", "continue" and "checkout".
Details page has "checkout" and "submit"

Shop for other
products or
continue with
checkout

Shop for other products Continue with checkout

Input shipping and
My Biz homepage
payment details

Thank you page
(payment processed,
order ready to be
shipped)

Customer can ﬁnish
things here

Limited special offers
(this is how add-ons
should work) when you
purchase in the next 30
mins.

Limited specials added
to purchase

Optus MyBiz - Shopping process

ANALYSIS AND REVIEW

Expert reviews and site analysis

Usability Review:: Homepage
Top level menu items should be kept to 7 items or less (look at
1 www.apple.com as an example). Reconsideration and
prioritisation of global items is required.

2 Menu items as images increases the load time of the page. Use
2 text instead of images wherever possible to speed up page
load times, increase search engine readability and on-page
1 searchability for users.
3
Avoid using ALL CAPS where possible. Online, using all caps
3 allude to shouting. This occurs in various places across the
entire website.

Reconsider the purpose of the homepage. In the online space,
4 a website is a company's brand. Within 2 or 3 seconds, visitors
should be able to tell what the website is about and
immediately form an affinity with the brand.

4 Visitors arriving at the site may be looking for what David Jones
has on offer at the moment. Going past the Elizabeth St store in
6 Sydney, there are posters for "You are invited to save" and
"Royal Randwick Spring Carnival". There should be cohesion
5 between online and offline activities.

Avoid using Flash when another (more accessible) technology
5 such as HTML, AJAX and images will do the job. The main
element on the homepage takes almost 3 minutes to load using
a 3G connection. 4 minutes for the entire page.

Maintain a consistent visual style. These links lack the same
6 design polish and flair that is under the credit card, ie "Learn
more" and "Apply now". Look at www.stgeorge.com.au for an
example of making links visually obvious, yet not underlining
10 them. www.apple.com is also another good example.
7 Avoid right alignment with text. Right aligning text makes things
7 difficult to read and/or scan.

9 Links should be self descriptive. Eg "Christmas Hampers 2009"
8 instead of "click here". As a general rule, avoid using the same
name for different links or calls to action.

Make the entire box clickable (linked) so that the visitor can
8 9 quickly get to where they want to go instead to having to hunt
down a small target area.

Ensure there is always enough padding around text so they're
General Notes 10 not squashed against margins.
The page title (<title></title>) should be URLs - Regarding the top level
"David Jones" or "David Jones Australia". navigation items, some items are
Not "David Jones - Homepage" subdomains, some link to pages in
the same directory, and others to
pages within subfolders. URLs
need to be human friendly and
structured for consistency.

Regardless of the technology used
to generate the pages, the URLS
should be shown as .htm or .html
Max Soe
User Experience Consultant
maxsoe@gmail.com
0405 022 546

Ux examples

More Related Content

Viewers also liked (10)

Recently uploaded (20)

Ux examples