banner

UI DESIGNER AND BRANDING

Proxy Orbit is an API that provides rotating web proxies to developers. I was the web designer for this project. I focused on creating the brand and story for this company.

line-break

WIREFRAMING THE BASICS

The majority of the content for this website was divided between the features the company offers and the subscription plans. Due to the minimalistic requirements the website is a single page- divided into sections. Prior to adding any graphics, the basics needed to be created first. I started by working on the order of information a user would see as they went down the page.

OUTLINING THE BASICS

The rough sections were initially drafted to be: Homepage, "who are we", Features, and Subscription plans. Later these sections were finalized to: How it works, Features, Plans, API, and Stats.
Once the sections were finalized, there were a couple of UI elements I wanted to include. The goal of these elements was to lessen confusion for users. This included a traveling navigation bar and indicators of where the users were on the page.

screenshot
screenshot

The logo, located in the top left corner, allows the users to see and be able to recognize what website they are on. The top bar travels as the user scrolls down the page. Also to create a sense of location, as the user gets to a section of the website the section title seen in the top bar is underlined. This way the users know where in the website they are at all times. This page also contains the pitch of what the website offers. The call to action here is displayed in the complementary color of blue to draw the eye to it.

line-break

BRANDING AND GRAPHICS

The goal for the branding of this website was to create a fun atmosphere for a topic that's usually a bit more serious. I used the name "Proxy Orbit" to create a theme for the branding and overall look. When creating the logo I really wanted to focus on simplicity. I knew I was going to add more detail to the graphics I was planning to design.

screenshot screenshot screenshot
screenshot

CREATING THE EXPERIENCE

I choose these darker tones of blue and purple to create a calm but enticing experience. The graphics here expand off of the space theme. The moon and satellite were graphics I had personally done, while the earth and shield were icons from online.
As you can see the only copywriting I had done was on the homepage. All other text was for the client to fill in. I used Lorem ipsum as a place holder to show what a final product would look like.

screenshot

For this page I wanted to focus on the content, so the graphics are kept to a minimum. The only additional part here was that as the user hovers over the "View Plans" button it would change colors.

screenshot

The ultimate goal for this website was to get users to buy a plan. The "call to action" button on the homepage took them here as well as the "View Plans" button on the features section. Each plan is a different color to express that they offer different features. The middle one, decked out in a gold color (similar to all the call to action buttons) is used a promotional tactic. All values were made up.

screeshot
screenshot

The plan that is most beneficial for the company and the user is highlighted in a gold/orange color. The same color as the call to action buttons throughout the website to create recognition. The badge is to show that it's the best deal for the user's money.

line-break