001 - Sign Up

About
Create a landing page that promotes the offer of free 1-month premium access.
Date
2023 February 22
Tool
Figma

Brief

Create a sign up page, modal, form, or app screen related to signing up for something. It could be for a volunteer event, contest registration, a giveaway, or anything you can image.

‍

Find Reference

For this challenge, I have decided to create a landing page that encourages users to try our service with a free one-month trial. For reference, I checked Spotify's website.

‍

List of Information

Header: Logo, Home, Support, Log In

CTA: Enjoy 1 month free of ReadBook Premium access

Description: Indulge yourself in reading over a thousand book collections. Bill will be automatically deducted $9.99/month after the end of the trial. Feel free to cancel anytime.

Button: Start free trial

Terms and Condition:

  1. Once the trial period ends, you will be automatically charged on a monthly basis until you cancel your subscription.
  2. The company reserves the right to modify, suspend or terminate the service at any time and without prior notice.

‍

Design

Logo

For the logo, I have chosen a typographic concept with a slight twist on one of the letters, and I have also noticed that the "oo" in "book" could be turned into an actual book, as seen below:

Image 1 - Logo ideation

‍

Image 2 - Final logo design

‍

Landing Page

For this challenge, I have chosen to use light cream as the primary color as the color can create a warm, cozy, and relaxing atmosphere, which can lead to a comfortable reading experience similar to that of a physical book.

The pages color in many physical books is often in pale cream, which can make it more comfortable to read. By incorporating this color into the design, I hope to create a similar feeling of comfort and relaxation for users on the landing page.

Image 3 - Landing page ver. 1

‍

Image 4 - Reference for hero image ver. 1

‍

For the illustration on the landing page, I decided to create a whimsical drawing. However, after completing the design for the hero image, I felt that it could be improved and done in a different way. In which I created a ver. 2.

‍

On the ver. 2, I decided to create illustration where a person is reading a book and could be seen as below.

Image 5 - Hero image ver. 2

‍

Image 6 - Landing page ver. 2