Sarah A. Queiroz's profile

Screen Design and Copy Rewrite challenge

Scenario

Ollert is a product management app that uses work spaces. Most users end up having multiple work spaces, often with different passwords. 

Upon realizing that having to remember multiple passwords was a pain point for many users, the product manager and UX researchers suggested a solution where users can log in using a link sent to their email, bypassing the need to log in using a password.

Feature info and requirements:
Currently, users log in by entering their email address on a screen with a blank field and clicking “Log In.” Then they're taken to a second screen where they enter their password.

With the new feature:
The second screen should now give them the option to get a sign-in link via the email address associated with the username.
They must also still be able to sign in with their password.

The problem

Current copy written by the designer:
Guess what!? You don’t have to use your password anymore. 
Tap or click here if you want to get a sign in link to your inbox that will let you sign in without any problems. This will allow you to log in to all of your projects fast - no password necessary! Once you do that, you’re good to go.

My Job
Turn the paragraph above into a well written and well-designed screen that appears after users click “Log in” with their email. Give it a basic mobile device design using a design tool (Whimsical, Figma, or Miro), or even pen and paper. Describe or provide an image for the screen.


New user flow proposal
I considered users that already have an account on the app as well as new users that my need to register on the platform. So the new app flow would have the two already existing screens for log in (e-mail + password) as well as the registration screen and the reset password screen.
Result

To create the content on each screen, I considered:

• The user's primer action;
• The most important information he would have to read;
• And also the approach to inviting the user to use the new feature;
• The color choices of the other players in the same market.  

I didn't use any CTA with “click here” or “tap here” since these two calls to action don't follow the best UX Writing practices.
Splash screen: I created a charging bar, to inform the user the app was almost charged. This screen can also be used in other waiting screens.

• Sign in screen: I inserted the e-mail placeholder for users that already use the app, as well as the option to register for new users of the platform.

Register screen: I added a “back” button as well as the password screen. I considered one of Nielsen's Heuristics (control and liberty) so the user would have more control over the app and screens he would want to be. I also add the option to reset the password in case the user doesn't remember his.

•​​​​​​​ Invitation copy: to use the new feature “Passcode” I considered the information architecture as well as the good practices of UX Writing. So the Tittle matches the call-to-action button, I explained to the user that it's possible to log in to all of his accounts with this new feature, and he would only have to click the button.
Scenario

You’re an UX writer at WingScanner, a new low-cost airline. They’ve just developed a new feature where customers can pay an extra $20 to use special security lanes and skip long lines at security. 

Feature requirement and info:
Encourage the customer to pay extra for the feature (Save some time)
The feature will be the last screen before the check out screen on the mobile app;
It costs an extra $20.

Related airline apps that may offer a similar service
• Ryanair
• easyJet
• Wizz Air

Points to consider
• Come up with a name for the feature
• Think about how best to structure and present the necessary information
• This feature gives people more time to relax before their flight 
• The screen comes before checkout, so it’s important to consider how to prevent user dropout.

WingScanner currently copy written by the designer
Extra payment of $20? It’s worth it! It will help you get through airport security much faster. Then you’ll have more time at the gate for duty-free shopping, or just relaxing. How cool is that?

My job
Turn the designer’s copy into a well written and well-designed screen that appears right before the user gets to the checkout.

Identified problems
• The copy needs to be compelling without blaming the user for not purchasing the service;
• We need to convince the user without inducing him to commit mistakes;
• We need to inform that the service cost 20 dollars, but not highlight the price;
• Make the benefits clear and bring them to the first reading information.

My goal was to create a compelling checkout screen that summarize the most important information about the Easytravel service. Considering that the main goal was to make the user purchase the offer of Easytravel I:

• Brought the benefits to the headline of the interface;
• I used bullet points to make it easier for the user to read the benefits;
• I made a CTA with a different tone of blue (the one that it has on the brand of Wingscanner), so it could bring more attention than the “No” button;
• I inform the cost of the service but tried to not bring too much attention to the price of the service.

Screen Design and Copy Rewrite challenge
Published:

Owner

Screen Design and Copy Rewrite challenge

Published: