Nikisha Roberts
Paragon One
Internship
Timeline: October 2020 - November 2020
Team: Byron H. (Co-founder and CTO of Paragon One)
Role: Created wireframes and high-fidelity mockups for the first version of Webpages
Tools: Webflow and Figma
Project Overview
Paragon One wanted to develop a personalized portfolio web pages for interns to showcase their work performance to recruiters. My role was to design the webpage, establish the information hierarchy, create the wireframes and high fidelity prototype.
Constraints
The site had to remain mostly static, simple in color and layout.
Understanding the User
The purpose of these personalized web pages are to give recruiters further insight to an intern’s performance and role at the company. According to various studies, recruiters view a resume for an average of six seconds. We had to determine how to condense multiple weeks worth of data into a webpage with a minimal reading time.
How to Display Skill
The biggest problem we faced on this project was how to display skill improvement through the internship. At first, I created a star system where each skill performance was given 1-5 stars. The process gave us insight into how we could consolidate information categories. For example, there was an overlap between the performance score and skill section so they were combined into a reestablished skill section. Finally we decided to use spider graphs and understood that we had to add extra elements to make it more understandable.
The soft and hard skills are separated into two graphs, the skill name and their description are listed under the graph. When the mouse cursor hovers over the skill name within the graph, the corresponding name and description are highlighted.
Telling A Story Through Information Hierarchy
When determining the order of information, I thought about which sections would recruiters deemed as the most important to view. If a recruiter is viewing this site, that means they are mostly likely seeking out contextual information outside of the intern’s resume. The progression of information builds up so when the recruiter scrolls through the skills section, they would understand how those skills correlate to the projects and how impactful the projects were to the company.
Adding Personality
Every intern would receive the same webpage layout, the data points are the only thing that differentiate them from others. At the end of the internship, interns fill out surveys and a few of the questions asked about their overall experience at the internship. Interns are also evaluated by their program managers. Most of the webpage is made up of the program manager evaluation. We thought it would be insightful to include a quote to share the intern’s experience outside of the manager’s evaluation.
Box with quotes vs speech bubble with face - We decided to add a speech bubble with a photo rather than a box to essentially add character to the webpage and break up the large amounts of text.
Takeaways
-
Collaborating on this project was a great experience. Although Byron led the project, my input was always valued. I got the opportunity to explain and alter my design decisions when they were challenged. I got the chance to experiment with color, spacing, and layout. There was a daily stream of feedback on each mock-up so we endured multiple iteration cycles in a few weeks. As a result, the end product was better than the earlier versions.
-
There were a few points in the project where I felt stuck. This encouraged me to seek out new resources and ask for outside feedback.