top of page

​Message Center Website

Group 337.png

In this project, I helped our customers to design a website for automotive dealers to login and send messages (like recall of the vehicle, ads) to the owners of vehicles. The users can check the message sent by dealers on the in-vehicle infotainment system once it is connected to the Internet.

The Process
Getting Clear for the User Tasks

To have a clearer picture of how should the website looks like, I first listed several users’ tasks below:

​

  • Account sign-in and sign-out.
     

  • Password reset or changing password.
     

  • Add/View/Delete messages.

Design Principle

After the user tasks were derived I started competitive for the design trend of other similar websites, then came out the following design principles:
 

  • The sign-in and sign-out process should be as simple as possible.
     

  • The flow for viewing and sending messages should be similar to the experience of using email inbox.
     

  • The overall UI flow should be streamlined and intuitive.

Error Handling

While designing the website I also worked with the engineering team so that we came out with several use cases that need to be considered. For example, how should the system help the user while entering the invalid information during sign-in? How should the system deal with messages with no contents but the user press the [Send] button? I also worked with our writer team to optimize the expressions of error messages for different uses cases.

The Result

A message center with streamlined operating experience was delivered, which allows the users to sign in/out, recover password, edit and browse messages.

Landing pages for account sign-in

Group 337.png

Landing page of the message center

Group 338.png

The page for editing new messages

Group 333.png

One of the use cases for handling one of the fields is invalid when sending a message

Group 339.png
More selected projects
Group 388.png
Group 351.png
Group 352.png
Group 356.png
Group 386.png
Group 355.png
Group 353.png
Group 357.png
bottom of page