With Easter approaching, gift baskets, egg hunts, and tulip arrangements were on my mind. I was looking at some options on a gift ordering service that I've used a few times and I thought: what would a bunny gift another for Easter? Maybe some kind of decorative egg, similar to a Fabergé egg?
So I thought it would be a good exercise to design this service: celebratory eggs. 🐇
UPDATE 06/2020: The celebratory eggs was a terrible idea. I'm going to stick with general gift deliveries. ;)
Since this app is made up, I figured a good starting point would be to leverage information from experiences with similar, existing services. I searched Google for recommendations on popular services and did a quick competitive comparison.
I chose this method first because I needed to gather information on what was popular and important to that industry, in order to craft my research plan. Otherwise, me not knowing anything specific about these types of services, I might have unknowingly gathered unimportant or irrelevant information.
From these comparisons, I learned that each site focuses on a different aspect of a gift: the "perfect" gift vs. the "popular" gift. Suggestions on selecting "the perfect gift" were present on both sites. Bestsellers and seasonal options such as Easter gifts were displayed prominently.
There were also options to filter; by delivery zone, price, gift recipient - i.e. parent, spouse, child. Details such as shipping speed and multiple coupons/discounts were everywhere. Reviews didn't seem to be a large factor, although star ratings were visible.
From this comparison, I knew I wanted to focus on five areas:
- What of these services are familiar? Which of them should be studied as representations of user expectations and known patterns?
- Who are the recipients of these gifts? Are they primarily older generation family, younger generation family, friends, or colleagues? This informs the primary "audience" for our user's mindset when shopping, as well as provides some demographics (albeit flawed data if, for example, you didn't ever purchase gifts for your children).
- When are these gifts given? Gift-giving holidays, birthdays, other holidays, life events, or for no particular reason? This helps to refine the scope of when this service might be utilized, how wide of a range it must have, how complex the filtering capability needs to be, and whether there is an opportunity to fill an unmet need with a niche service.
- What are the top two considerations when choosing a gift? Pricing and discounts, shipping logistics, or whether it's "right" for the recipient? This helps to inform what is most important to our user and thus, what should be displayed prominently - a low price or whether the item is available in that zip code.
- Demographics data to help inform user personas, however, it would be optional.
I posted this to my Facebook page as well as some UX Slack workspaces I belong to. I received 16 responses. I set the threshold for focus at +/- 8 responses, which left me with these:
- Gift Ordering Services Used: Amazon, Edible Arrangements
- Gift Recipients: Parent/step-parent, Sibling/step-sibling, Partner/spouse, Myself
- Gifting Occasions: Birthdays, Valentine's Day/Sweetest's Day/Romantic Holiday, Christmas/Hanukkah/Kwanzaa/Winter Holiday, Major life events (Births, Deaths, Marriages), Minor life events (Moving, new job)
- Primary Considerations: Item has high rating/positive reviews
- 68.8% Female, 31.3% Male
- 50% aged 25-29, 18.8% aged 30-35, 12.5% aged 36-40, 6.3% aged 18-24, aged 41-50, aged 51+
Based on the survey responses, I identified a list of tasks that users should be able to complete within this app. I then mapped those to basic page flows in order to begin to build out a list of requirements. This also helped with information architecture as I could draw relationships between content on the same page.
I identified five main screens from the user tasks: Homepage, Product Collection, Product Detail, Cart, and Checkout. Some elements appear on every screen, such as the navigation bar, and at least one product name and price. There was also an opportunity for a lot of re-use with simple screen variations such as Product Collection filtering for recipient, or occasion, or price, or type, et cetera.
Low Fidelity Wireframes
Every screen started with the same navigation bar for consistency's sake. I also created a lot of elements that could be re-used in multiple places - the page header, the dropdown, the different variations in the product boxes, and of course buttons.
Very few things were specific to a single screen, but I developed a few using text styles set from other components as a foundation. The promo on the homepage utilizes the H2 style over the basic image placeholder. The options for a specific product are actually modified versions of the filters from the Product Collection screens. The reviews section uses a lot of the H3 and P typography and star ratings from further up on the Product Detail screen.
View the full set of wireframes here: https://xd.adobe.com/view/ed554c69-a506-4cac-aeb7-f8f919dacc3d-b806/
My plan is to pause work on Splendigift now that the basic wireframes are complete. Maybe I'll come back and design the rest soon!