Pretty Nice Flowers is a flower delivery service. I address the challenge, process, and solution behind creating an intuitive form field that fixes a reoccurring issue of flowers being delivered without a note from the sender.
Complaints of people receiving flowers without knowing who they’re from.
The challenge
The task
Analyze the customer journey from discovery to purchase and delivery and find the gap in which users are missing to provide a message to their recipient. Find the most cost-effective way to fix this issue by changing only the copy, in a short period of time.
The Original Design
Below is the original form field that customers would have to fill out before completing their purchase for delivery.
-
The original form field lacked a sense of information hierarchy. Which part of the form field was mandatory for the customer to fill out? With little information, and with the lack of importance, I could understand why customers were not filling out certain parts of the form.
-
The header label for the field box “Note” didn’t provide much description or option for personalization and lacked a call to action (CTA) for the customer. The main issue was that people were continuously skipping out on sending a delivery note. How could I make this more apparent to the customer that they should fill this part of the form out?
-
I wanted to write the form field from the perspective of Pretty Nice Flowers's desired clientele. The brand of the flower shop is quirky and fun--much like the customers who shop there. The form field did not reflect this brand tone.
How could I easily resolve the issue of customers skipping an important part of the form?
Option 1
Option 2
The Re-Design
My re-design included two different options to fix this issue. I also tightened up the UI of the form field while providing more context, personalization, and functionality.
Option 1
The customer can write the recipient a quick note OR the customer can check the checkbox "Note not needed" if they don’t feel a note is necessary with their purchase.
Option 2
The customer can simply sign off on the flowers with their name OR the customer can check the checkbox "Remain Anonymous" if they don’t feel like sharing their identity for whatever reason.
My reasoning
Sometimes, the signing-off part of giving flowers as a gift is either an oversight or people want to send flowers anonymously. In that case, they should have the option to do so. If the sender checks the "remain anonymous" box at least this way the recipient will also be notified that the sender chose to remain a mystery. Maybe the flowers are for a surprise party or a secret crush! Whatever the reason it is nice to give the customer options.
Asterisk use
I included asterisk's beside the “Recipient note” and “Your signature” to indicate that selecting an option- whether it be writing a note or not- is required to be filled out before proceeding to place the order.
I chose to add an asterisk because it is a common typographical symbol that users are familiar with seeing. When an asterisk is used beside a form field box, most people know it indicates a required field.
Colour choice
I chose to make the new form field font green to match the logo and bring attention to the required parts of the form field. I ensured I checked the colour with a contrast checker so it would still be in accordance with WCAG.
Colour Chosen: # 22593D
Subheadings and placeholder text
I decided to provide subheadings under the fields for "Recipient note" and "Your signature" to give context to each section. I added placeholder text which brings a humanized tone to the form field. Using this sort of language gives the customer an idea of what they can write as well as prompts them to type something.
Option 1
Option 2