Website Redesign Case Study

Grande Flowers Website Redesign Case Study - Home Page

Grande Flowers is a flower shop in Shorewood, WI. During my Interactive Design class at MATC, I was tasked with re-designing a less-than-UX-friendly website. Click on the buttons below to see all the steps from the original website to my creative solutions for a UX-friendly responsive re-design.

THE FINAL RE-DESIGN

Grande Flowers Re-designed Home Page

HOW I GOT THERE

STEP 1: CLIENT RESEARCH

Desktop View of Original Home Page

ABOUT GRANDE FLOWERS

Grande Flowers has a love of nature and their flower shop is their connection to that peace and calm. They strive for excellence in quality and freshness.

Each customer is treated with the personal attention they deserve and every order is special. They offer a variety of gifts for that special someone including plants, balloon bouquets, plush animals, greeting cards, local gourmet chocolates from Burke Candy, and more. They can even create a combination gift basket with any of the above. Grande Flowers’ team of gifted designers can create an original, personal creation for any occasion.

The family owned and operated local business puts quality and service first. Whether you’re selecting flowers to celebrate a milestone, honor a special loved one or just treat yourself, Grande Flowers will make it extraordinary. They believe that your flowers should be fresh and perform to their optimal beauty. Delivery of the highest quality flowers begins with buying top-grade inventory from the local markets. Their flowers are then processed using only the best cleaning techniques and preservatives. All flowers are stored in a temperature-controlled environment to ensure your flowers are long lasting.

Mobile View of Original Home Page

STEP 2: IDENTIFYING YOUR TARGET DEMO

CURRENT DEMOGRAPHIC: Upper middle class Men and women aged 30-70.

TARGET DEMOGRAPHIC: Looking to expand this demographic to include younger, more middle class customers.

PERSONA 1: EMILY

Emily – 36 yr. old white female with a Bachelor’s Degree in Zoo & Aquarium Management. She works as a marine animal trainer in Milwaukee, WI and has lived in IL, MI and WI. She is currently engaged in an interracial relationship.

WHY SHE’S ON THE SITE: comparing arrangements of local florists for her wedding day (desktop and tablet); then, once she chooses Grande Flowers, using the website to pay for her arrangements and communicating with the florists for design and proofs (mobile)

SHE GETS INFO FROM: friends and co-workers, Facebook recommendations and Google searches.

HER TECH USE: on mobile daily for several hours scrolling social media; gets news from mobile apps; uses a desktop for only a couple hours a day for work (reports and research); tablet for reading in the evening.

HER MOTIVATIONS: nature, environmental issues, love, animals, family.

SHE’S LOOKING FOR: flowers to make her wedding day perfect!

SCENARIO

Emily has done a Google search on her desktop at home for local florists when planning her wedding day. She will be working with her future mother-in-law on the flowers, so she’s sitting next to her. She chose three separate florists (Welkes Milwaukee Florist, Grande Flowers and Milwaukee Blooms). She then goes onto Facebook and asks her friends for recommendations. From this process, she chooses to go with Grande Flowers. She is now searching their website for pre-made wedding arrangements and using their ideas and available flowers with her ideas for her wedding design. She found their email address through the website’s Contact Us page. She will now return to the website after several emails back and forth with the florists. She will create an account so that she can pay her deposit to start consultation and design. She will return to the site to check the progress of her order and to pay her

PERSONA 2: COLTON

Colton – 23 yr. old white male with a Bachelor’s Degree in Pre-med; currently attending medical school. He works for an online medical supplier while in school and is from a small town in WI. He is in a committed relationship with his same-race boyfriend.

WHY HE’S ON THE SITE: Google search for local florists to drop-in and pick up an arrangement for a friend in need (mobile).

HE GETS INFO FROM: friends and co-workers, Facebook recommendations and Google searches.

HIS TECH USE: on mobile daily for several hours scrolling social media; gets news from mobile apps; uses a desktop for several hours a day for work; uses multiple gaming hardware including Virtual Reality.

HIS MOTIVATIONS: love, equality, medicine and healthcare, food, “living well”, self-care.

HE’S LOOKING FOR: flowers for a friend who needs a smile on his way to work.

SCENARIO

Colton works at a cubicle for a medical supply company while attending medical school. He likes to spread smiles and yesterday at work a co-worker expressed she was feeling down about the loss of her dog several months previously. Spontaneously, the next morning, Colton decides to pick up some flowers to brighten her day. He does a quick mobile Google search for florists that are in-route to work and that are open. He then uses his mobile for maps to get to their

PERSONA 3: BOB

Bob – 55 yr. old white male with a Bachelor’s Degree in Business. He works as a salesman for an office supply company and is from Milwaukee, WI. He is married to his same-race wife and has two children, aged 9 and 15.

WHY HE’S ON THE SITE: purchasing flowers for his wife, daughter, co-workers, (desktop).

HE GETS INFO FROM: friends and co-workers, Facebook recommendations and Google searches.

HIS TECH USE: on uses a desktop for several hours a day for work; uses his phone for quick map searches and communicating with his family, does not really go onto social media sites on his phone; NOT a user of Twitter or Instagram; uses a tablet to read in the evening.

HIS MOTIVATIONS: family, love, travel, the “finer things in life”.

HE’S LOOKING FOR: flowers for his loved ones; multiple repeat user/customer.

SCENARIO

Bob lives in the neighborhood and stopped in one day for some “just because” flowers for his wife. He was so impressed with the service and the quality of the flowers, that he has since returned several times. He recommended the shop to a fellow neighbor on Facebook. Now, they are his go-to florist and Bob shops online for flowers for his family, friends and co-workers. He uses a desktop while at home or work and pays online for

STEP 3: MAKE FUNCTIONALITY RECOMMENDATIONS

Use Responsive Web Design

Images need to be larger

Search needs to be more functional

Inventory needs to have filters for better UX

Ability to build a customized bouquet

Review link for each arrangement

Show the shop and staff more (service is their best quality!)

Make online shopping easier; use Google sign-in option to cut down number of fields to fill-in

STEP 4: CREATE SITE FLOWCHART

STEP 5: DESIGN SITE WIREFRAMES

STEP 6: FINAL RESPONSIVE REDESIGN COMP

Grande Flowers Re-designed Home Page
Grande Flowers Re-designed Secondary Page
Visits: 617