GS2
Government Solutions and Services
A freelance design experience to provide a number of product solutions for the government contracting startup.
Role
I worked as a Freelance Product Designer for GS2 - Government Solutions and Services to redesign and implement a number of product experiences for the company.
Duration
6 months (July 2021 - Present)
Overview
As my breakout role in freelance design, I was tasked with creating a new design for GS2’s website and a number of their digital products. This version of the site aimed to offer an organized, clean, and professional appearance for this veteran-owned government contracting business.
Team
Individual Freelance Design
Tools
Figma, HTML/CSS, Squarespace, Spark, Photoshop, Canva
Scope
UI/UX Design, Branding, Prototyping, Information Architecture, Design Systems, SEO
Location
Louisville, KY / Nashville, TN
Getting the Ball Rolling
While I navigated the job market and interviewed for my first full-time job, I was connected with Government Solutions and Services; a veteran-owned startup company out of Louisville, KY. They were in a similar position that I was; a company with a lot of promise in a breakout position that needed to showcase who they were and what they could do to the world.
Seeing an opportunity to work with a group of amazing veterans while being able to contribute value to their business, I accepted a freelance contracting position as their Product Designer.
BACKGROUND
What is GS2?
Government Solutions and Services is an organization created and run by Colonel Blaine Hedges (Ret.) in March of 2018.
The company aims to be a bridge between private businesses and government contracts, connecting opportunities between both groups and offering their consulting resources for ensured success.
The company identifies as a service disabled veteran owned small business and employs a staff that consists of a combined 100 years of military experience with a number of skills and specialties.
IDENTITY
Initial Interviews
To begin this opportunity and properly align myself with the values of the business, I interviewed the CEO and President of the company, Blaine Hedges. I got a feel for the organization, the services they provide, their logo, the company culture, and what exactly GS2 stands for.
These things would be important to know when creating products for GS2. I wanted to create a design system with a unique voice that showcased who they were to their clients and potential stakeholders, as well as crafting something for the company to better articulate what they could offer the market.
As I gathered information, many of the things I heard were familiar for me. Coming from a military background myself, it was relatively easy to pinpoint GS2’s underlying value statement, a saying I came up with which stuck as their overall tagline:
“Service to a higher standard.”
Creating a Brand
When talking priorities for the organization, Blaine discussed a vision to expand his presence online; this included the GS2 website, social media accounts, and other public-facing products.
With no written guidance or company documents to reference in creating this new site, I decided to take the initiative and create a document that could assist with creating the products they sought.
Seeing as this is a UX/UI case study, I won’t go into too much detail on the branding document. What’s important is how creating this documentation would assist with developing the user experience, as well as guide user research. It would go on to answer critical questions that could help me out with the design like:
Who is GS2?
How does GS2 want to articulate its value?
How can we phrase selling propositions to enhance GS2’s reputation?
What design captures the company’s values, vision, mission, and capabilities?
If you’re interested, you can view it here:
VISIBILITY
Prioritizing my work, I knew that a key factor in winning against other contractors in their space was to bring GS2’s web service on par with the professional standard of their competitors.
I was informed that a colleague of theirs in the past had created their site before I came along, but was unable to finish it. Knowing this, I examined what look their former web solution took to get an idea of what attitude I should capture when designing their new look.
A Review of the Former Site:
Conveniently, GS2 uses Squarespace as the CMS to host their entire site, which is a service that I am well versed in. If you didn’t notice, my portfolio runs on it as well!
Looking at the site, I was excited at the opportunity to construct a website from the ground up, the previous design gave a little bit of guidance and information, but left a lot of room for me to innovate! To get things off on the right foot, I decided that the first logical step would be to build a design system that the site could be founded upon.
Design System
The Visual Audit
If you viewed my branding document, then this will all look pretty familiar. If not, then I began my first steps by doing a design audit of the former website to pull out key elements:
I identified the exact shades of the colors in their logo and found complimentary shades to enhance them
I took note of the clean lines and rectangular buttons, as well as font choices
I got an idea of the type of information architecture that they already had in place and how they displayed it
Building a Visual Design Language
In building this language, I placed emphasis on 4 specific elements:
Color
Typography
Sizing/Spacing
Imagery
Using their logo and current website as a springboard, I started building a color palette to operate on as well as typography that would be applied to the whole site.
The company remains steadfastly patriotic from a background of military service, so a collection of reds, whites, and blues seemed ideal when structuring the design system.
When considering the typography, I made this selection:
Serif headings
(Cormorant Infant where available, Cormorant Garamond for the rest)
Sans paragraphs
(Lato/Aktiv Grotesk Extended where available, Darker Grotesque for the rest)
These fonts were chosen to adequately reflect a clear hierarchy. This combination also served to project a professional, organized, and loyal brand appearance that reflects values associated with military or government service.
I modified the fonts to have 4 sizes available for headers and 3 for paragraphs to have a range of flexibility when crafting content and organizing the site.
The original site had a number of images that GS2 had placed; I decided in the next iteration that it would be effective to mix these with stock photos offered by Squarespace to portray a unique blend of personalization and business success.
Color Palette:
Typography, Sizing, and Spacing:
Establishing a UI/Pattern Library and Documentation
Once again, I had a lot of room to innovate as I looked through the old site. In my head, a number of things came to mind like buttons, forms, modals, images and more.
However, before I started crafting anything like this, I wanted to know at least what the site was going to look like, so I put this one in my back pocket for later.
IDEATION
At this point, I had gotten to know GS2’s platform, their voice, and their attitude pretty well.
GS2 was actively pursuing contracts, and getting their website to a more workable state was a big priority. Knowing this, I had to accelerate my research and design processes in order to deliver a working product faster. So, at least for phase 1, I made my primary users the stakeholders in order to have a quick turnaround.
Design Sprint
As a bit of a creative exercise, I skipped lo-fi prototyping and gave myself a challenge: using only what is on the site already, redesign and structure it in a way that makes it the same, but also new!
I gave myself 2 hours to complete the task; this is the result:
Before:
After:
I excluded some of the pages that I created for brevity, but you get the gist.
This exercise was really enjoyable for me, and I used it as a benchmark to measure in what direction I should go from there.
I sat down with Blaine again and asked for his thoughts. I took a few liberties with redesigning the logo, however Blaine decided that he wanted the original logo instead due to copyright reasons. Overall, this presentation was received favorably and ended in me essentially receiving a carte blanche to execute how I saw necessary as I moved forward with the site.
Planning and Execution
When discussing the goals that Blaine had for the website and what he wanted it to achieve, the top two priorities mentioned were to,
Highlight and showcase the company in a way that boosts their reputation
Generate leads and increase the chance to obtain contracts
Luckily, I had all the content that was going to fill these pages outlined in my branding document. The questions now were where will it go and how will it look. With the interface that I was envisioning, I wanted to have a traditional feel that embraced a modern architecture and was able to make its messages pop.
Information Architecture
Before anything else I had to organize all the potential information on the site and create a blueprint of the features, infrastructure, and hierarchy.
A general structure seemed to have already formed itself through the old site. So in a sort of closed card sort, I asked Blaine to list out all the things that he wanted placed on the website and to group them by category.
I decided to create an initial sitemap that very generally would define where certain content would go.
This map formed the basis for the site navigation.
I wanted to limit the breadth to 5 items plus the contact page and intentionally avoided depth, as the site was relatively new and my stakeholders wanted to remain dynamic with where future content could go.
User Flow
Since we’re dealing with a website that doesn’t have any in-depth features like account creation, newsletter signups, tools, etc., my user flow was designed to be pretty simple: To spark interest enough to inspire filling out the form on the contact page and generate a lead.
In the spirit of this, I wanted to design the pages to be clear, communicative, and have easy entry points to all other pages of the site without becoming exhausting.
Version 1
(In this section I would include images for you here to compare and contrast to the current version, however in the rapid execution of this phase I completely forgot to take them… Please accept my apologies!)
Actionable Research
I built out a first version of the site and had it go live for about a month. I made sure that all the critical elements were in place so it could work as it should while also maintaining professional standards, but my next real focus was to do some rapid user research, a content audit, usability testing, and agile iterating on the design.
Overall, I conducted 8 interviews and 15 abridged usability and sentiment tests.
I sat down with two users specifically and let them navigate the site as they spoke out loud about what they were thinking.
Content Square ranks bounce rates for websites by industry, and according to them B2B has an average bounce rate of 81%. While over this month GS2 benchmarked at 55% for 323 visits, I wanted to investigate how to get it lower and plan for the future.
My two users echoed what the rest of the research was reflecting; the architecture in place was deemed to be sound, but the content and where it was placed was ineffective.
Noting this, I drew up some quick lo-fi prototypes to organize my thoughts, pulled and organized content in a different manner, and went about crafting the second version. At the same time, I pulled the official .xml sitemap and got analytic services going for the site through Google and Microsoft to take a more birds-eye view at what was going on. While I believe that qualitative data is more actionable, the quantitative data given by these analytics sites provide unprecedented insight into usability and efficiency of the web service.
Version 2
Looking at the Numbers
While keeping the site active, I made the changes necessary to transition to Version 2 through October 1st. The site is currently live on GS2’s website at www.gs2global.com, I’d be humbled if you checked it out!
While this is the latest push for the GS2 website, I view it as the first real base through which I can look through a more informed lens at the website. The analytics services that I started gave a valuable and in-depth look at things like demographics, user flow, benchmarking, and a staggering number of other variables. In the time since I implemented the v2 changes, I have been able to expand my quantitative research to include the many variables mentioned above. These factors provide more insight through which to make necessary changes and optimize performance.
My contract with GS2 ended in May of 2022, content on their current site may not directly reflect the work I did on their site.
Visit www.gs2global.com for more information.