404 NeoBank Page

Preliminary Decisions

1. Have the ‘Home’ and ‘Sign up’ as the most important buttons.

2. Have the 'Log In', 'Search' and 'Help' buttons as secondary buttons.

3. Distinguish the importance differently within the singing and logging in section and the

action section. Log in and sign in by colour and action section by colour and stroke/border.

4. Use colour and strokes to show these differences.

Some 404 Error Pages incorporate an extra colour to draw attention to the button and making it one of the more salient features. With busy pages it is useful to add to the colour pallet but I decided against this as the NeoBank has a semi-classy brand

image as it is a bank which should be perceived as trustworthy; I think in the case of

Piggybank, adding another colour would diminish the trustworthiness as well as make the design look less classy and less cohesive.

Rationale

I added the “Home”, “Search” and “Help” buttons as actions that the user can take once they land on this page. Users may potentially quit whatever action they were performing because they see the error and think they cannot take a next step. I added three options at the bottom in buttons as they draw attention.

I was thinking about adding hyperlinks at the bottom of the body of the page but I thought this is more relevant to the brand and is more salient.

Adding many different options for users to take gives them freedom as well as hopefully

leading to their problem being resolved.

The microcopy of “Oh no!” is comical and has an explanation mark at the end. This takes the edge off of users potentially making a mistake and may result in them being more forgiving than if they saw a 404 page implying they made a mistake.

I put the blame on the company by saying that “our piglets” made a mistake. Non

confrontational.

The use of contractions in the text also makes it more informal and laid back / relaxed.

Branding:

In the task description: the “UX approach will vary drastically from that of a traditional bank.”

affirms that the branding shouldn’t be as serious as that of a “traditional bank”.

I chose a Piggybank as the logo because it is the name of the company. I decided upon a fun look for the brand (represented by the Piggybank itself, fun font of the “404”, big buttons comical text “piglets”) as the name of the brand fits this image rather than a serious branding.

This is a banking company so it should be serious to an extent but as it is a new type of “digital neobank” being solely online I thought a comical angle would suit the brand better. The serious angle doesn’t suit the word “PiggyBank” and so a more comical brand image was established.