Web Design for NYER

编组.png


About the Project

This is a web design contract project for NYER, a career mentor company. The website is an updated version of their previous one, created a brand new color theme with all the visual elements being updated. The floating visual clues are attached throughout the website, expressing the company's concept of building a smooth connection between student and their career paths. The project is mostly individual, with continuous discussion and feedback sessions with the business owner, listening to their request and achieving his business goal.


Design Practices

Design Researches

Ideation

Rapid Prototype

High-fidelity prototype

Web UI design

Follow up maintenance


Design Tools

Wix Online Tool

Sketch

Adobe Photoshop

Web Design Project


Design Duration

Feburary - April 2021


Resources

Wave Accessibility Tool

Website reference of related industry

编组 2.png

DESIGN PROCESS

屏幕快照 2022-05-03 下午10.55.19.png
屏幕快照 2022-05-03 下午10.41.15.png

The target is to create a modernized version website for NYER, to present its business value, and convey to the user their previously achieved goals in the past projects.

编组 2.png

DESIGN OPPORTUNITIES

Company Value

Match company’s principle of empowering student’s career with a more intelligent method, while conveying the professional methodology of company’s service to the customer.

Business Value

Present the service and domains in a clear and structured way.

Highlight the past successful client cases.

Design Value

Update to a more modernized visual style that catches the client’s interest.

Reorganize the information and build a clear user flow with hierarchies.

编组 2.png

PROBLEM OVERVIEW

屏幕快照 2022-05-03 下午11.07.32.png
屏幕快照 2022-05-03 下午11.07.44.png

I started by reviewing their primary version of the website and observed some problems. As a first-time viewer, I valued all my observations a lot and took as many notes as possible. I made a summary and categorized the problem I found into 6 categories.

屏幕快照 2022-05-03 下午11.14.06.png
编组 2.png

RESEARCHES

So with those observed problems, I communicated with the client again and asked them about their ideas of the company’s value. Also, I asked them about the target customers, and they told me most groups are new grad students and people for job switching. 

屏幕快照 2022-05-03 下午11.44.25.png

Based on the information above, I did lots of research on education and consulting websites and deep-dived into their user flows and UIs.

屏幕快照 2022-05-03 下午11.50.18.png

The direction becomes clear after the research, and I summarized the design direction into the following 5 principles. Color and font needs to be consistent and limited in types, information should be clear and précised, CTA should stand out. Images should be replaced and get involved with actual business and clients, and the white space should be considered in the new design as well.

屏幕快照 2022-05-03 下午11.53.13.png
编组 2.png

IDEATION

屏幕快照 2022-05-03 下午11.58.15.png

With that direction, I iterated the design solution into more specific details and assisted with some brainstorming process. All the details of layouts, colors, fonts are planned ahead for the next step of prototype.

IMG_6167.JPG
编组 2.png

INFORMATION ARCHITECTURE

屏幕快照 2022-05-04 上午12.00.37.png

Regarding the information architecture, I summarized a large amount of information from their current website and set them into 4 columns. Homepage, service, success project cases, and their latest courses. In each column, the corresponding information finds its home clearly in the new user flow and avoided the problem of losing hierarchy in the previous version.

编组 2.png

PROTOTYPE

屏幕快照 2022-05-04 上午12.08.57.png

Then I started with a rapid prototype of 4 columns and asked the client their opinions about the color theme and the basic layout. After several rounds of discussion, I chose yellow and gray colors as the main color platte to match the company’s specialty of young and high-efficient style.

屏幕快照 2022-05-04 上午12.13.01.png

High fidelity prototype for client review

编组 2.png

WEBSITE SHOWCASE

屏幕快照 2022-05-04 上午12.19.38.png

Homepage

屏幕快照 2022-05-04 上午12.19.47.png

Business pages

编组 2.png

SUMMARY AND REFLECTION

屏幕快照 2022-05-04 上午12.27.29.png

This website received very positive feedback and greatly improved the client’s brand identity and gets their new information promoted. With a follow-up conversation, I heard they got 20% more impressions than the previous version.

 

As for my self, this is a common workflow for all my individual design projects, starting from effective research, thorough evaluation and in-depth communication with customer, I clearly understood what they need and how to improve. Also this task was completed in a month, so I am able to control the process in a time-sensitive condition and finally achieve the goal of design.

屏幕快照 2022-05-03 下午10.55.19.png

© 2022 Franky Wang All Rights Reserved