BuildThis Universal Process9 min read

Building a website is similar to building a house. Whether you’re building in the cyber world or the real world, it’s important to hire the right people. From choosing a plot of land (Who is going to host my new website?), to pouring the foundation (Do my developers know what they’re doing?) to choosing each doorknob thereafter (What kind of functionalities do I want my site to have?) – you cannot afford to entrust the web design (or house building!) process to just anyone. At StickOutSocial, we aim to build you a beautiful and solid cyber “home” without any of the hassle. Today, we’re kicking off an in-depth blog series that dives into every step of our universal process from first meeting to final launch. Over the course of the next few weeks, we’ll introduce each of the four phases: Discovery, Design, Development and Deployment.

Why A Universal Process?

By creating these brief stop signs and deliverables, we ensure that clients get exactly what they’re looking for in their final product – on time and within budget.

Our first phase, Discovery, is exactly that: Discovering. This is when our team gets to know you and your company. We figure out what your project is about, your user needs, and your company goals. We collect all of your imagery and content and begin to piece together a skeleton of your website.

The best part? If you want to meet in person over coffee or a beer, head to our office at the Board of Trade building in the heart of Chicago and meet our in-house development team. We are real, live people and don’t outsource a thing (aka: you can get a hold of us with questions at any time!).

Deliverables Include:

1.) Company Objectives, Website Goals & Methods: Every project starts with a confirmation of your company’s objectives and website goals. We review any information gained in the proposal process and identify the methods we’ll use in design and development to best meet your goals.

2.) Industry & Competitor Research — Users (Audience & Personas): Identifying your target audience is a pivotal step in the web design process. We perform research to understand your industry & your competitors. In conjunction with information you provide on your target audience, we create either an Audience Overview or User Personas to achieve your goals. An Audience Overview outlines your audience and how they will interact with your website to best engage and produce your user goals. This documentation enables designers & developers to empathize and build the website with sensitivity toward end-user goals. By defining and approving your audience and user goals upfront, we neutralize subjectivity throughout the design process.

3.) Design Inspiration: We meet with you (either in person or via phone call) to discuss your likes and dislikes, websites you love and hate, and any information concerning your branding that must be followed when moving into wireframing and design.

4.) Functionality Reviews: A Project Manager & dedicated developer lead in-depth reviews of the functionality you plan to include on your website. We identify the plugins or customizations hat we’ll need to implement to best achieve the desired functionality to get users to their end goals.

5.) SEO Keyword Identification: Each web page will be set up with unique meta titles and descriptions from a global format.

6.) Content Structuring: Content structuring combines your business and website goals with the industry, competitor, and audience research to determine the following:

Wireframes: Wireframes provide a visual framework to the layout of the website. They strip away advanced design elements so we can focus on user experience, information flow, and function. Mobile & desktop wireframes are developed and approved prior to the design phase to reduce costly rounds of design revisions. Wireframes ensure everyone on the web team and the client are on the same page about what the website is supposed to do and how it is supposed to function.

Sitemap: A sitemap lists the pages of a website. It is used internally as a planning tool for a website redesign and it also serves as its own web page for users and search engines to access. SOS will work with the client to determine how information across the website should be displayed and accessed, which is a key phase of content structuring. By combining our findings from user research, known company goals, and additional client input, we will be able to produce the resulting deliverable — the sitemap.

Media: Imagery and videography can make the difference in a website’s visual appearance. Imagery and media placement will also be determined in the wireframing and content organization process. During the content structuring process, the types of media and visual assets used to complement or display the web copy will be brainstormed. The media assets used will be finalized and obtained during the design phase, according to the mapping of these items during this phase.

User Flows, Main Messaging, and Calls to Action: People don’t just come to your website, and right away do what you want them to do. In most cases, they need to go through a set of steps leading up to the action. The main messaging and calls to action should lead your users to fulfill your business objectives (getting users to sign up for something, getting people to purchase products or join an email list). Highlighting the main messaging and CTAs means understanding the needs of your website’s visitors along with the problems they want to solve. Information identified in the user and audience discovery is used here to identify the questions your visitors have while on your website and the information they need to take action. This stage in the process guides us through copy organization by defining the key content to be presented on each web page.

7.) Finalized Timeline + Estimates: Prior to moving into Design, StickOutSocial will provide the client with a finalized timeline for the design, development, and deployment phases of the project.

Our second phase is Design and this is where we put together a web style guide that ultimately sets the tone for your entire project. Think of this phase as working one-on-one with an interior designer for your home. It involves choosing the right fonts and colors and it begins to solidify the aesthetic feeling of your website while organizing all the hardware that our designers and developers need for the actual building of your site.

Your project begins to come to life in the Development phase. Our construction team is out there hammering the nails and painting the walls. You can even watch us build by viewing and tracking the progress on a live URL while we’re completing the code. You don’t have to worry about too much in this phase as we are all hands on deck.

Deliverables Include: Development Environment, All Functionality Implemented & All Pages Developed

Before we hand over the keys to your brand new website in Deployment, we do our final walk-throughs and continue into several rounds of quality assurance including checking out the new space on different browsers (ie: Chrome vs Safari) and devices (ie: iPhone vs Samsung Galaxy) to make sure that all of your clients are seeing a beautiful website.