Special Olympics was started by Eunice Kennedy Shriver in 1968 as a way to provide people with intellectual disabilities a place to play and feel included. Today, her vision has become a Global movement with over 4.7 million athletes competing in 169 countries.
In the summer of 2018 Seattle, WA hosted the 2018 Special Olympics that allows over 17,000 athletes participate in activities across the state, thanks to help from more than 8,000 active volunteers. To create interest in and engage the audience the Team of Washington State decided to launch a landing page that acts as a single online resource for those interested in the event, including athletes, their families, the press, and other community members and fans wanting to learn about individual events, participants, volunteer opportunities, sponsors, and ways to contribute.
I worked in this project as a team member of a larger team at 1205 Marketing, an integrated marketing agency based in Seattle, WA. The team consisted of different creative professionals. I collaborated closely with the Chief Marketing Officer and a Wordpress Developer.
Rion Haber - Content & Site Map
Chris Mendez - Team Washington Logo
Matt Patternell - Development
The new Team Washington landing page should be recognizable yet distinct and offer more contemporary look and feel. The design elements and imagery should create anticipation of the 2018 Special Olympics with intimate athlete, coach, and volunteer close ups that make the event feel personal and authentic.
The design should take into account that there are athletes and other site visitors that have disabilities. They webpage should follow basic ADA requirements.
The landing page's main filler will be large images that highlight the achievements and dedication of the athletes. The images will be surrounded by lots of white space to give the page a more modern look and allow for enough contrast between the text, the images, and the background. To further enhance accessibility, all fonts will be bold and big and easily readable on all devices.
The page will break away from the standard symmetric layout that is usually used by Special Olympics and will have an asymmetrical balance throughout the page that is active and grabs attention. The balance between the white space and the elements on the page will create an interesting contrast which will direct the movement of the eye across the design and let the user explore the story of Team Washington.
Getting to Know the Brand
Special Olympics has been around since 1968 and has build strong values and a recognizable brand. Going through and understanding their brand guidelines was an essential part of the process. The new landing page has to feel like it belongs to the same family as anything else creates by the company. Words that describe the brand personality were the core I built on when brainstorming on the website structure and flow.
Inspirational - The page has to be powerful, simple and assist in motivating people about the upcoming Olympics.
Joyful - The graphics and copy need to be uplifting and positive.
Determined - The photography and short biographies need to recognize the journey all athletes and coaches take to succeed.
Authentic - Special Olympics is all about real people, real communities, and real results. The landing page should feel genuine and inspire people to contribute.
Research & Inspiration
I drew inspiration from images of website layout on pinterest. I looked of ideas on how to use large images in an effective way and create an interesting flow from one section of the website to another. I was fond of the idea of using an asymmetrical design layout where the content doesn’t lend itself to perfect symmetry but the elements balance out throughout the page.
I also looked at already existing Special Olympics websites such as the Team Washington Official Page, the website build to specifically honor the 2018 Olympics, and of course the official Special Olympics website. Most of them offer a block-styled, symmetrical layout which, when combined with the brand primary colors, can look quite cluttered.
On the other hand, asymmetrical balance is more dynamic and interesting. It evokes feelings of modernism, movement, energy and vitality.
Sketches and Low Fidelity Wireframes
The first step in the process of building the page layout was to sketch many different ideas that were later narrowed down to three major variations. Those sketches were sent to the client for review to make sure that all content is present. The finalized sketches were then put together in a low-fidelity digital wireframe, which clearly defined where all objects are placed and allowed us to do some initial user testing.
Challenge and Revisions
The initial ideas an low fidelity wireframe were discussed with the client to see if all necessary content is in place. There was an issue with the ability of the page to scale. The initial design was set up to take you through all 14 sports on the 2018 Olympics and highlight 3-4 athletes. That was the problem. Team Washington wanted to list and recognize all athletes - there are at least 5 per sport.
That was a challenge for my team. How do we keep this a one-pager and show 40+ athlete and their bios? After a few days of throwing ideas around and discussing the issue with a developer we decided that the fastest way to do it is to create an archive page for each sport, where you can go and view all athletes if you are interested into reading about their life and achievements.
Interact with the final prototype!
Scroll up and down the page, explore the participating sports and coaches!
The landing page lauched on March 28th, 2018 and can be viewed at www.teamwa2018.com . It was welcomed with cheer and happiness from the Team of Washington. As the 2018 Olympic Games are approaching we are yet to see how the page performs in terms of increasing donations and engaging people to volunteer and support Team Washington.