At my company, we have been developing web and mobile apps for almost 13 years. For the first 10 of those years our team was completely made up of developers: we did not have any UI or UX designers on our team. When we began our first project with our newly hired design director, we found something that we were not expecting, but very pleasantly surprised by. In addition to developers creating better-looking applications, they were also significantly more productive. This article will explore what we learned in that process and outline how great designers can make development teams more productive.
When a design is shown to a client or product owner, it is often only the initial and ideal screen state that is depicted. A form is either empty or full, the user-entered values are just the right length, and the imagery provides the perfect contrast with overlaid text. It is fantastic that the screen looks beautiful in this setting, but that does not mean it has been completely designed. Great UX designers can think through distinct scenarios such as:
They think through each of these possibilities and dictate how the screen should appear in each state.
Without a talented and thorough designer thinking through each of these details, it often falls on a developer to discover and “design for” these various states. It means that developers will spend less time writing code and more time contemplating the permutations themselves. If a developer is constantly running into unaccounted for behavior or layout possibilities, they are going to be significantly less efficient and the final product is likely to be much less polished. If a designer thinks through these possibilities before the development begins, they enable developers to create more complete solutions in much less time.
Keep in mind: it is improbable that every permutation is accounted for before development begins, but that is also something UX designers can help with. The best designers make sure they maintain active channels of communication with their developers throughout the entire development process. If developers know they have this support, they can offload questions and remain productive.
All of these small efficiencies can add up to make a sizable difference across the course of a project. We have seen this be the case on every project where we take the time to conduct a complete design process. Even if it takes more time and thinking up front, it more than pays for itself throughout the life of a project.
One of the catastrophic things that can occur in the course of a project is to realize well into development that a major workflow is fundamentally flawed, a primary user action can’t be completed, or vital information is not present on a screen. When this happens, entire portions of a software solution might have to be redesigned and significant parts of code deleted. It can cause projects to be significantly delayed or go dramatically over budget. It could even cause a project to fail entirely.
Great designers can drastically reduce the likelihood of this occurring on a project. In addition to dictating the specifics of an application, experienced designers consider a solution in its entirety. They can lay out the primary workflows, information architecture, and user experiences that make up a system before the first line of code is written. By employing a methodical approach to design and following an iterative process, UX designers can significantly reduce the chances of large issues being found late into the development process. If a designer can circumvent even one such problem, they will more than pay for themselves.
One important thing to remember is that processes exist for a reason. Some clients or project timelines might push for skipping steps or rush certain portions of the design process that don’t appear to produce an intrinsic and immediate value. Designers should stand up for their processes and explain that it is better to think through these more difficult challenges at this phase, rather than risking they are found too late in the process.
The previous two sections outline substantial ways designers can make developers more efficient and help ensure a project succeeds. There are also some small things that designers can do to improve developer efficiency and the designer-to-developer handoff.
Great designers take the time to prepare the assets that are required by developers for a particular project. For example, they know to make visual assets for a mobile app exportable at 1x, 2x, and 3x sizes. By doing this before handing off their design files or exporting to a tool like Zeplin, they will make their developers more efficient. Designers should also take the time to prepare things like app icons at all of the required sizes for the various platforms, rather than trusting a developer to resize from the one version provided properly. They should also remember to save images at the appropriate file size for optimal web performance and mobile browsing, rather than hoping that developers don’t incorrectly downsize the files themselves.
One thing I would recommend to all designers is observing how a developer takes a designed screen and implements it. In doing so, the designer will be able to see the various steps taken by the developer along the way and might discover ways to improve the efficiency or accuracy of this translation further. In addition, the designer might be able to help the developer more efficiently use the design tools that the developer is less experienced with, but often utilizes for this hand-off period.
As a final note, designers and developers should try to have a collaborative relationship built on mutual respect for each others’ skills. All too often there is a combative or dismissive relationship between these two roles. If that is the case, all the tips in this article will have a minimal impact on overall team productivity.
Designers that utilize the techniques described in this article will be significantly more likely to be a part of successful and highly polished solutions. Besides, freelance designers and design agencies can leverage the first two sections in arguing for larger design budgets by outlining how it will save the budget elsewhere on the project and reduce the overall project risk. Designers at product companies or development agencies can employ these tips to increase their value and make their entire team more efficient, which hopefully results in their salary increase.
About the author: this is the guest post by Paul Francis, a partner and the lead product manager at The BHW Group, a digital agency based in Austin, Texas. In this role, he assists app owners in making high-level decisions and guides them through the design, development, and deployment processes.
Title image by Csaba Gyulai
Read more how to become a UX designer and check the list of the most hated UI and UX patterns in 2018.
Have an interesting article to share with our readers? Let’s get it published.
Discover top Figma plugins to streamline your workflow, enhance visuals, and add creative flair to…
Learn how to manage visuals in blog posts to optimize them for SEO in this…
Unraveling Figma’s pricing structure: tips to avoid hefty bills and save money. (more…)
Don't switch tabs to browse icons, illustrations, and photos for your websites. Get them inside…
Transform your Notion space with custom covers! Dive in for easy steps, pro tips, and…
Each design has its own scale. It applies to elements size and like thickness. Now,…
This website uses cookies.