How to Incorporate Visual Design into an Agile Development Process

Bringing your designers into projects at the very beginning of the agile software development process is advantageous. A solid visual concept for the project can eliminate additional work in sprint iterations and create a shared vision embodied by the customer and the development team. But agile software development – specifically Scrum – is not in line with how designers traditionally work. The idea of collecting feedback regularly and making adjustments to the overall vision may overwhelm designers, making them feel like their job now belongs to the group. Additionally, separating visual design from user experience has its own unique challenges. So how do you incorporate visual design into an agile development process?

Wireframes

Serving as a tool in research and communication, wireframes help focus the direction of the design in the beginning stages, like Sprint Zero. As mentioned in our previous post Bootstrapping Agile Development, Sprint Zero is necessary when working on brand new projects in order to find your project’s “soul” or focus. This period involves discussions and brainstorming between the product owner and the development team. While the developers are defining requirements and gathering user stories, designers have an opportunity to define the visual design requirements and begin wireframing.

Depending on the scope of the project, wireframing can mean anything from rough sketches on whiteboards to paper wireframe sketches. The idea is to concentrate on simple, low visual sketches, gather feedback from the team and customer, and get closer to the project’s focus. It is imperative that this step not be skipped because so much valuable feedback can be gathered from the development team and product owner. At this point, it is not necessary to have every detail planned to the nines. Instead, this serves as a springboard to discover what and how your product can achieve a user’s desired outcomes. (Skala Preview, Marvel, and Adobe Illustrator are an integral part of the design process for us, though there are many tools we use to help bring a product to market.)

Prototypes

Once the visual design is (mostly) agreed upon during the planning stages of the project, designers can focus on prototyping. The sophistication of the prototype will vary at each organization. The key is to feed the collaborative beast that is the agile process by continuing to gather feedback and test the iterations. At this point, UX is the driver and visual design is simply a passenger, but that doesn’t mean that visual design doesn’t continue to be refined. If a larger scale refinement for the visual design is needed, then it’s time to backtrack and revisit the planning stages. Avoid spending too much time making major visual design adjustments during sprints as this can lead to missed deadlines and an unfocused project.

To summarize, designers are very much a part of the overall software development process and should be included from the very beginning. Finding the best way to merge their method of work with agile development will take some time. It may be different for every organization. However, if you keep the basic agile principles in mind, one can expect to reap the benefits while building a product that works well, looks good, and satisfies the customer.