GoNation Design System

Design System + Style Guide

A library of reusable visual components and features that reflect GoNation’s aesthetic and promote design cohesion


Sketch | Adobe CS


2 weeks



GoNation is a social media platform that utilizes geofencing data to connect users to local businesses.

My objective for this project was to build a design system using atomic design principles that builds upon GoNation’s existing visual design scheme.

The purpose of the design system is to provide a living, dynamic collection of visual features for use on the GoNation platform. In addition to serving as a style guide, the design system will grow with the platform and evolve to meet the changing needs of the application.

The design system will allow GoNation’s designers and developers to collaborate effectively by delivering reusable components with consistent attributes that can easily scale.


case study published by UXPin describes the usefulness of design systems. They found, as platforms grow, user interfaces can become increasingly inconsistent which can lead to user confusion and dissatisfaction. Designs systems can prevent these inconsistencies by supplying the entire team with a single resource to draw from.


The benefits that design systems deliver to enterprise companies are clear, as they allow huge teams to maintain established norms, but they can provide value for small teams as well. Design systems created early in a company’s growth can provide a template for development of future features and speed up the design process.

Airbnb Design System - An example of large company's design system
"By creating a consistent language that our internal and external users can understand, we can create better experiences for the people who are using our products."
- Arjun Narayanan
UX Designer


I began the development of GoNation’s design system by auditing the existing platform and creating an inventory of the current user interface components:


From the interface inventory, I identified patterns in the usages of each component. These patterns informed the creation of a set of design principles for GoNation’s Branding Guide.


The design system, built in Sketch, features nested symbols that will expedite workflow and provide a customizable template for further platform development.


If the company’s visual branding evolves over time, this library can continue to grow and change – providing an enduring style reference.