MATTHEW COGSWELL
INTERACTIVE
LU X U RY L I N K . C O M
Luxurylink.com is an online destination for booking
luxury travel with signature extras at insider prices
It’s business model was very complex and was in
dire need of clarity, simplification and a visual
brand overhaul.
H O M E PA G E -
RESPONSIVE
Flexible Nav System
Prominent, Persistent Customer Service
Clear Calls To Action
+++++++
Clean, Modular Design
Chic, but Accessible
Fully Responsive
+++++++
Behaviorally-Target Content
Location-Aware
User-Aware
Clean and crisp, relying heavily on the seductive visual imagery of the destinations.
Above the fold, the nav is structured to give a strong callout to the in-house customer
service team (which has a conversion rate of over 4%), a strong hero graphic with a
tested headline and call to action, and a definitive place to start (search) which had
the strongest tested path as far as conversions went.
Immediately visible is behaviorally-targeted content based on browsing habits, past
purchases, location, etc... and the much-needed ad space.
Designs were fully responsive and adaptive, changing layout and strategy for mobile
H O M E PA G E
A clean and easy-to-update
approach allowed for versatile merchandising.
A LTERNATE
Hotel modules include
prominent imagery, hotel
name, location and package
inclusions
The page was divided up
into merchandising sections,
each with a specific purpose
from “general browsing” to
“location-aware merchandising”
To mirror Luxury Link’s
weekly “INspiration”
newsletter, a more visual
approach was created
* A fun alternate, showing dynamic ajax sorting with ads being slotted in amongst the content. This would’ve allowed
for a more engaging design with less scrolling (something
that should’ve been tested) but ultimately the tech team
Due to a travel user’s different browsing habits, a
persistent “recently viewed”
module allows them to jump
from property to property
decided against coding this, and advertising partners could
not conceive of an ad that changed placement based on
content surrounding it.
P R O D U C T D E TA I L S P A G E
Pages were
organized in
columns with
info on the left &
product on the
right to allow for
simultaneous
exposure on scroll
Above the fold:
Compelling hotel imagery with information
on discount, lowest room rate available,
CTAs as well as basic hotel information
such as category, audience & style.
P R O D U C T D E TA I L S P A G E - V A R I O U S P A C K A G E T Y P E S
Package type 1
Package type 2
Package type 3
A LTERNATE
* An alternate approach to the PDPs was to split the hotel info
and the product info into two separate pages (80/20 info split)
as over 50% of our competition does. This would’ve allowed for
varying levels of sell based upon the user’s point in the purchase
cycle, allow both “types” of information to shine without cluttering each other, and allow for marketing to more directly link to
pages based on their needs.
Ultimately, management feared this might be too revolutionary.
S E A R C H R E S U LT S P A G E
After testing, it was found that search results had most engagement in a
near-list form (rather than larger imagery)
Since each property had anywhere between 1-8 separate packages associated with it, each module needed to be able to expand based upon the
user’s level of interest while filters would be able to filter out options based
on price (per night or per package total) sub-location (like region) and
package type (Signature Escapes, Auctions or Rooms + Perks)
A map feature also allowed users to browse in a more visual manner.
Since the mobile experience was focused primarily on
research or browsing (rather than purchasing) the Search
Results were heavily optimized for mobile with some
feature stripped for a smoother experience.
CHECKOUT
Based on extensive analysis of cart
abandon points, user monitoring (via
inspectlet) and best practices, a simplified checkout was created to streamline the process and remove as many
barriers as possible.
It was also adapted for mobile with an
entirely mobile-exclusive version created to best make use of the phone’s
real estate and native capabilities.
Post purchase, the confirmation kicks
off an extensive cycle leading up to
the user’s arrival at the hotel.
Great care was taken to create confirmation pages that are clear, concise
and utilitarian without being cold and
uninviting.
RHINO
Warner Music Group’s catalogue label, Rhino
needed a direct-to-consumer commerce website
that not only exemplified their brand but also
facilitated a very complex, multi-codec digital
download system, as well as paying homage to
the disappearing physical music era.
THIS WEBSITE IS NO LONGER LIVE
After I left WMG, it was not a sustainable effort and
the label decided to move more towards Sync & Licensing
R H I N O. C O M H O M E PA G E
After extensive brand evaluation and audience segmentation, it was
concluded that Rhino’s die hard traditionalist fan-base needed subtle
cues built in to the UX that reminded them of the music stores they
sorely missed.
Without being gimmicky, tabs were created that mimic those in record
crates that segment artist sections, a paneled PFA spun like store adverts, and graphics had a handmade feel hearkening back to the days
of independent xerox music posters.
R H I N O & R H I N O H A N D M A D E P R O D U C T PA G ES
A RT I S T PA G E , S TO R E M A I N PA G E , A RT I S T I N D E X . . .
V A R I O U S D I G I TA L P L AY E R S
CHECKOUT
A stepped guest checkout
was created to simplify the
process of payment, shipping
& review for complex, split
cats (including physical and
digital product, or one vs. the
other)
Repeat customers have a
1-click super-simple smart
checkout that adapts to the
cart contents (digital only,
physical only or a mix)
All checkout types
end up at the same
user-friendly
confirmation page
L O O K M AT I C
Lookmatic sells bespoke eye wear - which is ridiculously complex, from the frames to the lens options
and finally the complex method of deciphering
one’s prescription. I simplified the purchase process as well as created a user-friendly checkout
& account system
THIS UI HAS CHANGED
Though the UX I established remains, the UI has changed.
Also, the Account system was removed due to outsourcing
L O O K M AT I C P R O D U C T D E TA I L S P A G E
Purchasing glasses is complicated, with many steps. More steps means more
confusion and more confusion means more abandonment. For Lookmatic, I
broke out the glasses steps from the actual prescription type so that you could
add your fully customized glasses to the cart before having to input prescription data. Breaking up the steps made it simple to use.
After choosing Rx, the module slides left for the next choice:
1: type of Rx
(transition)
2: lens thickness
3: dynamic tinting
4: sunglasses tint
review
g
CHECKOUT
Prescription lens information is a jumble. To simplify it for the user I
laid it out in the same visual manner as the glasses themselves, with
left eye, right eye and spacing. The cart itself had to be segmented into items that would be Rx-modified, and items that would not
need any additional steps. From there it was a basic accordion step
process for the cart with a very comprehensive confirmation screen
and email.
MY ACCOUNT
LEVI’S APP
Unbeknownst to men, women’s jeans have a story.
Each one is fitted specifically for a type of body, and
each one has it’s own back story, dealing with sustainable practices, fabric sourcing etc...
This is too much to put on a jean tag so Levi’s
developed an app that read a QR code on select jeans
and allowed for the digital story to unfold, as well as
allowing the user to fully explore what jeans are best
for them.
The best part of the app was the user’s ability to rate
the jeans via the phone’s built-in camera and video
capabilities. Some even could get real-time, feedback
as to whether or not their friends/peers felt the jeans fit
right. Participation also unlocked incentives.