PRE-DEVELOPMENT PROCESS

Project Kickoff

The first step in our process is the Project Kickoff call. Think of it as the “getting to know you” call. During this call, we’ll review the project goals and timelines. You’ll get to meet our Project Manager Teri and Creative Designer Manasvi and ask questions about the project and deliverables. We’ll make sure that everyone is on the same page moving forward. Typically, this call involves all of the key stakeholders from your side, so we can move right into the next step in our process all at the same time: Stakeholder Interviews.

Stakeholder Interviews

Stakeholder interviews are a big deal in UX design. They help establish the foundations for any project by providing valuable insights that would otherwise be difficult — even impossible — to obtain. These insights guide the flow of the entire project, such as business goals, technical constraints, usability problems, and more. A stakeholder is anyone within an organization who can offer useful advice about the product and ultimately help simplify the design process. Additionally, stakeholders rely on the product’s success for their own gain, either personally or professionally. Although these are normally high-level employees, stakeholders can be lower-level employees or even prominent users.You’ll be surprised at just how differently each stakeholder interacts with the product. Analyzing these perspectives will help you better understand what stakeholders want and need from the product.

Market Research

After the Stakeholder Interviews our team conducts market research to gain a thorough understanding of your organization’s place in the market. During this phase, we research each of the following questions: 

  • Who is your competition? 
  • What are the current industry trends?
  • How large is your target market?
  • What are your competitors’ strengths and weaknesses?
  • How are their websites constructed–what are they doing right, and what are they doing wrong?


The culmination of this process is a Research Summary and Research Ramp-Up outline. You’ll receive a detailed summary that outlines the answers to each of these questions, as well as key insights about industry trends and what your competitors are doing.

User Research

Great UX Design is grounded in great user research – driven by user insights while balancing priorities and technical feasibility. The goal of user research is to take the knowledge and insights gained from users to create user-centered solutions.

We conduct Primary Research by interviewing potential end users, which helps us collect qualitative data. This method explores the user’s attitudes, behaviors, and opinions as well as helps us understand the context behind why trends and patterns arise.

User Personas

User Personas provide key insights about a potential user of your site. These users are based on actual research, but are purely hypothetical, often combining the wants and needs of multiple individuals into the each final persona. It includes an archetype, occupation, workplace, personality traits and a brief biography. It goes on to detail the goals and motivations of the individual, the needs they have in a website like yours, and the challenges and frustrations they face when interacting with websites like your own. The user personas are the culmination of all of that research, and will be used as guides as we move into the site map, mood board, wireframe, and high-fidelity comp segments of the process.

Mood Board

Mood boards have a lot of different uses, but ours are focused on bringing the key elements that will make up your website together to clearly communicate our customized vision for your organization. It is a visual creation that brings together Images, Typography, Iconography, the Color Palette and the Brand Attributes that will define your brand and communicate your brand identity. These elements are the foundation of the mood board and capture the look and feel of your entire website, in one place.

Site Map

The site map is a visual representation of the structure of a website, from A to Z. Looking at the site map tells you what pages will be included, which items are top-level navigation pages, and which pages are part of a lower hierarchy. The site map isn’t always the most exciting deliverable in the pre-dev process, but it is vital to the process and yields a wealth of understanding and organization that helps us make sure that the site we build is meeting the goals our clients set out to achieve. It’s also a great opportunity to consider how they want users to experience their website. 

Wireframes

Not unlike an architectural blueprint, the wireframe provides a map for how the site will be built. It takes into account the user interface design, to consider how your final users will interact with each section of the page. Where will there be images, movement, or calls to action? It all comes to light in the wireframe. Furthermore, considering the UI/UX aspects of the site separately from the graphical elements helps to focus on the user interface alone, without getting distracted by stock image choices, font color, or other visual elements. 

High Fidelity Comps

This final step in the pre-development process is a compilation of the moodboard and wireframes. The end result is a pixel by pixel representation of what the site will look like. Our clients receive a comp of the homepage and 2 other pages. We believe these three pages gives the clearest vision of how the site will be built and gives you a chance to experience the full site design.

We use a service called InVision to load in the high-fidelity comp so that you can experience our full vision for your site in a web browser. It gives you a chance to review the site in a typical browser so you can start to imagine how it will all come together in the final version. It reduces the chances of change orders or costly revisions once development has already happened.

Pre-Development UI Kit

UI kits, also referred to as User Interface kits, are collections of premade user interface components and resources for both website and mobile projects. It acts as the last hand off piece from our designer to developer, before moving into development. UI kits often come with different color and style options, allowing developers or the client to fully customize the elements, templates, and layouts inside to create their own user interfaces and maintain brand consistency easily. 

PRE-DEVELOPMENT PROCESS

As part of our web design services, True Productions offers a 10-step predevelopment process that helps us execute your vision for your new site. 10 steps sounds like a lot, and it is! But it’s also the best way for us to get to know you and your organization so we can build you a website that speaks to your goals, your vision, and your company culture. The process includes design comps, wireframes, conversations with key stakeholders and potential site users, all with the goal of developing the perfect web experience, tailored to the needs of your audience. Think of each step in this process like one piece of the puzzle: as each piece gets put into its place, the whole vision of your website becomes clearer. It’s how we bring your vision to life.

EMPATHIZE

Learn about the stakeholders and audience for whom we are designing the website.

DEFINE

Construct a point of view that is based on user needs and insights.

IDEATE

Brainstorm and come up with creative solutions like the Sitemap and Mood board.

PROTOTYPE

Build a representation of one or more of your ideas to show to others.