Login Page:
Logo: Either your complete logo or a symbol mark.
Title: Tell the user this is where they login.
Account identification: A unique identifier for the user. (Consider multiple identifiers
to login with e.g. username, or email address, or phone number)
Password: A secure, private code that allows access to their account. (Create the
ability to make the password visible)
Link to reset password: A user may forget their unique code - let them change it!
(Position this link close to your password input field)
Link to sign up: A user may not have an account and landed on this page anyway.
Sign-up Page:
Logo: Either your complete logo or a symbol mark.
Title: Tell the user this is where they create an account.
Description: Describe the basic features of creating an account and set their
expectations as to what they can achieve.
Account identification: A unique identifier for the user to log in with. (An email
address is the most commonly used, as you are also gaining a method to communicate
with them beyond whatever they do next)
Setting a password: A secure, private code that allows them to access their account in
the future, that includes: a password strength indicator, password requirements
(length, special characters), the ability to make the password visible.
Link to login: A user may already have an account and landed on this page anyway.
Cart:
Metadata of items added: Name, size, style, quantity, price and images should all be
present.
Change or remove item: Give the user the ability to edit their items inside the cart.
Shipping options: Variants in delivery based on location, weight and time. (Clearly
show alternative shipping methods and the costs for each (if available))
Accepted payment methods: Ways a user can fulfil their purchase. (Using secure
payment providers instils trust into the user)
Link to checkout: For when they're ready to move on and fulfil their purchase. (Make
sure this stands out on the page)
Search results:
Search box: The element a user types in to make a search. (A search box should be at
the top of the page, styled consistently with other search boxes across your website or
product. Include a button to click to process search. Placeholder text can nudge the
user to make a relevant search.)
Visualization of results: Showing the items relevant to the search.
Suggested search items: Offer a search query to save the user from typing e.g.
currently trending, most popular, recently search, auto-correction.
404:
Logo: Either your complete logo or a symbol mark.
Title: Make it clear the user is on the 404 page.
Description: Explain why the user has landed on this page.
Contact Us:
Personality and branding: Visual character and tone of voice that align with your
brand. (Colloquial copy helps you appears more accessible to users)
Clear methods to contact: Phone number, email or a form to fill in for examples.
Social media accounts: User may feel more comfortable contacting via a social
platform.
