You are currently viewing Case Study: An NFT convention responsive landing page design |  by Hemanthkumar |  coinmonks

Case Study: An NFT convention responsive landing page design | by Hemanthkumar | coinmonks

I did this project to build my portfolio, thus this case study walks you through my journey through the visual design process for this assignment.

Responsive mockups

The task was to think of an event and create a landing page for it. I was given the option to decide whether the event would be linked with an existing brand or one that we could create!

New to trading? Try crypto trading bots or copy trading on best crypto exchanges

drumroll The chosen niche for me was the NFT event!

Now I am aware of your thoughts. Considering that I was also there. I had NO IDEA what type of events were held, what kind of activities were performed, who the target demographic was, or even what NFT actually was!

Accepted the challenge!

So, right away, I intended to do the following with this assignment-

  1. To widen my eyes and discover more about this new industry.
  2. To comprehend the numerous web and mobile UI principles and responsive design.
  3. Understanding how to find and rework meaningful inspiration (rather than recreating the wheel)

With the prerequisites and rules in hand, I embarked on a Fintech discovery voyage.

Which direction is it?

I followed a basic framework but made care to go back and forth at each phase to reinforce and validate my design selections through feedback.


Where are we going? Defining

Before beginning any actual work, I made the deliberate decision to create my own stand-alone event for the following reasons:

  1. I’d be able to create my own style guide.
  2. I would be able to specify my user group, which would specify the event’s voice (based on the kind of audience I wanted to cater to)
  3. I would have more freedom to play around with the interface.

When it comes to NFT, I believe many people are afraid, intimidated, or simply uninterested in it.

Since I was in this situation, I wanted to address the issue, and I thought a conference like Comic-Con would be a wonderful place to start! NFTS and finance events are always regarded as uninteresting, with only those involved in the industry expressing interest.

What if the activities could be made more engaging, the terminology could be made simpler, and the atmosphere could be made more lighthearted and approachable?

A comprehensive convention that would make NFTS less frightening. Young adults, those with a background in design, and investors from various backgrounds would be the target market.

With the exception of a few paid activities, I wanted to keep admission open and free on Day One (eg; certain lectures, workshops, setting up a showcase, and awards ceremony).

I was inspired by university symposiums that allow free admission because I thought it was an excellent system for the following reasons:

  1. A wider audience is attained by offering free access. I believe that this would be a good place to start because greater financial literacy is something that we as a society strive towards.
  2. By offering a “free trial,” you can pique people’s interest and get them to pay and sign up for the rest.
  3. Offering a selling point and persuading the public that the content is of high quality by providing a glimpse at the lineup.

Let’s start exploring-Ideating.

I began by learning the fundamentals of finance and outlining potential responses to the 5Ws and 1H of the project definition.

In order to obtain some knowledge and inspiration, I also made the decision to research numerous NFT conferences and websites in general. Here are a few examples:

A small snip of the inspirations I took

Following are some final observations on my studies to date:

For many, NFTS is quite intimidating and overpowering in general.

Although there is a seriousness to NFTS, the design language can yet be friendly and entertaining.

Going for cooler colors like green, blue, and gray is generally in style (much clean, and sleek, symbolizing growth and trust). However, using bolder hues like orange and purple can convey sophistication and vigor.

For a more welcoming, open, and inclusive atmosphere, font styles can be global sans serif typefaces. To retain the fintech aesthetic, one can choose formal serif fonts but should stay away from decorative fonts.

Adding a wireframe gives it form.

The primary CTA is quite obvious: conversion and registration. Additionally, this CTA needs to be emphasized in each component of my website. I have a few suggestions in mind for the same, including:

  1. In terms of brand partners, authenticity
  2. Social evidence in the form of endorsements and statistics
  3. Benefits in terms of networking and showcase opportunities Quality in terms of the speakers and the material

Information Architecture

Hero section: This section would include the primary heading, a brief summary of the event, and the primary CTA to encourage registration.

social proof: The major goal of this part is to provide statistics on previous attendees, presenters, and events in order to convey a sense of size. Since testimonials are actual customer feedback, they would also serve as social proof.

Feature section: will serve as the primary argument for “why should I attend?” Does this suit me? This would make it easier for them to understand the USP of the convention.

Partner brands: In order to fully define the brand’s reach and increase legitimacy and the likelihood of registration, I choose to add this section immediately following the FUTURE SECTION.

Speakers: Information about the lineup and specifics about each speaker are provided in this section. It would aid attendees in learning more about the speakers and in attempting to make connections with them.

Agenda: The event’s schedule and an outline of the agenda are provided in the agenda section so that participants can make advance plans.

After creating a wireframe, I got to work on my style guide. I chose blue, pink, and purple based on notions about the psychology of color.

Proofing — prototypes and mockups

The following guidelines were mostly taken into account during my iteration process:

Including images to reduce the amount of text
Consistency in the graphics by adhering to the color scheme
information that is concisely communicated

Since it is just a landing page, it didn’t require a lot of prototyping. But you can check this simple scrolling prototype of the page here and leave your comments and feedback on it!

You may find me pretty simply on LinkedInand InstagramI’m a covert design agent.

Join Coinmonks Telegram Channel and Youtube Channel learn about crypto trading and investing

Leave a Reply