March 29, 2017

Product development process

A working process varies from project to project in an IT-company. Goals, product’s features and a team - those are the components that impact the process. And the team always includes a designer who thinks on the best visual solutions for each task.

So here’s a question: how do we shape a development process? And shall we think over a workflow at all? The following knowledge will get you introduced to one of the live project’s life cycle, what a designer does throughout the project and with whom the designer communicates.

How to plan the working process?

Every day we use different web applications, watch beloved funny cats videos. But do we know the first thing about what these projects came through while development? When I think about a successful product creation scheme, the first thing to occur to my mind is the following picture.

A product creation scheme

The scheme is quite simple and, frankly, from the top of mind. We have an idea, then the Big Bang happens and we have the product ready for release. How to get out of chaos and develop the unique product that works? The project implementation will succeed if we only have a consistent and elaborated workflow.

The truth is, there’s no guide like “Planning a workflow properly”. Each project brings up different issues and tasks and these are the guys that shape a working plan. In this article you’ll get to know an implementation cycle of one of the ADCI Solutions company’s projects. The picture below captures this exact cycle.

A project implementation cycle

It’s not that scary. Our project will go through the 5 stages and will step in the bright future.

The project team:

  • Organizational development / marketing  — Curator of the project, ideas generator, content manager
  • Art Director — Curator of the design department
  • Designer — Responsible for UX & UI
  • Developer — Responsible for coding

There’s always a client with whom a team communicates. It’s either an external client or an internal one if the team is busy with the company’s own product. It’s the client who approves the team’s work.

Stage 1. Idea & Structure

At the very first stage we work with a project idea. A team’s aim here is to elaborate on the realization.

First, the team collects project data: goals, project description, methods of realization, for example, what technologies will be implemented. In the article Why Write User Stories you’ll find a guide on writing project requirements and why it’s important to give a feedback on specifications to your client. When it’s clear how the product should look like, the team moves on to the concept.

A designer’s involvement at this stage is essential. Why? Taking part in creating the product concept the  designer understands the product’s specifics that he or she will be later working on. Even at this point the designer can start thinking on the possible solutions and even present his / her ideas to the team and enhance the process.

Sketching is what we advise doing while brainstorming. A rough drawing or a rough structure of the product form the basis to work with later on.

Next we will learn why it’s a bad practice - to hurry up and start drawing the interfaces with all the fancy buttons right away.

Stage 2. Wireframe

What a wireframe is? What do we need it for? How to make a good one?

Wireframe

One of the wireframes definitions is the following: “A wireframe is a low-fidelity design.”

Let’s make it clear what this stage stands for. Being given a task a designer wants to implement all his / her skills and create a mind blowing design at once. This is the mistake that all junior web designers do: only elaborating on the product's elements first can save some time and lead us to truly usable product creation. It’s the wireframe that sorts this issue out. The designer focuses on the page goal and meaning in the context of a website, thinks over a [user] visual scenario. Exactly at this stage the designer decides how each block and each element will interact with a user.

A good wireframe is a basis for a web page and the basis for the future designs. This is not a dull grey draft. It is supposed to be the web page featuring all important elements that the release version of the product should have. Again, the things mentioned above significantly simplify the design process at the stage 3.

Stage 3. Design

When we have a structure approved and all the important elements placed, a designer can carry on with buttons drawing and playing with colors. Yey!

This is a general list of what the designer should be able to do to take part in any project.

  • Composition
  • Typography
  • Pictograms
  • Illustrations
  • Motion Design
  • Prototyping

Frankly speaking, the set depends on project goals and specifics, but still those skills do matter a lot. For instance, one project may require only interface creation, another project may require unique illustrations or a photoshoot organization, or even producing a video. You should also keep in mind that animation and interactive prototypes are trendy now; moreover, they help to test the product. More web design trends could be found at our article Web design trends 2017.

Stage 4. Development

When we enter the development stage it’s a designer who moderates front-end development: everything must be pixel-perfect! The designer makes sure that the product becomes what it’s meant to be.

We advise you reading the article How Befriend Design and Frontend to learn what content the designer should prepare to hand the project over to developers.

Bear in mind that both designers and developers work in the same team and ought to communicate with each other. The parties can and should make each other’s life easier: the designer should know what picture format is suitable for handing in the digital assets to developers and simply know the art of communication and negotiation. Only having agreed on everything the designer can be sure that the project will be implemented thoroughly.

Stage 5. Release

As soon as a project is complete we test our product and try to live happily ever after. At this particular stage the product faces with a real world. That’s the moment when we find out whether the product is profitable and / or reach the goals set or the other way round.

What is happening to a project team and the product after a launch? Team members carry on with support and maintenance, fixing, project communications and efficiency analysis.

Project’s life after release

Project analytics

Well, now our project works properly and a team keeps an eye on it. Marketers and designers hold surveys on performance and efficiency and Google Analytics is a great tool for such purposes. Analytics lets us explore the product’s perception, what solutions worked out well and what didn’t, what features should be added and what should be neglected.

Bad experience can throw a team back significantly. If the experience was successful the team may keep on working on the next product’s version.

Conclusion

Now you’ve got acquainted with a possible project workflow and what a designer’s role is on each stage.

What is an outcome? When I analyze the project I was participating in, I usually notice that these are bad communication between team members and other parties and ill-planned project stages that lead to problems. Planning the project step by step and distributing tasks wisely will increase your chances for success.

A rough plan that would fit any project:

  • Idea creation, setting goals
  • Elaborating on the conception and a project structure
  • Wireframe creation, use cases / usage scenarios creation
  • Design
  • Development
  • Launch

I’d love to notice one more time: there’s no universal guide on building a workflow. All the stages can turn out to be completely different than the same stages at another project. It depends on project goals. But following and covering the stages above - is a guarantee that the team will achieve its goals.

Was this article helpful? Click to rate: 
Average: 5 (9 votes)

You may also like

Table of contents: Design approaches Design process Content...
CONTENTS: Issue 0: where the problem is? Issue 1: styles’ structure...
Contents: Typical development process Waterfall model Agile...