Aligning Design with development is a key aspect of future business success. Interaction design (IxD) as a principal of study covers a wide field of expertise but doesn’t quite delve into the complexities of front-end development. When only considering the experience without the implications on the development you could possibly end up with a great experience but a messy code base, as well as unnecessarily pushed deadlines.
When starting with a design for a new feature or product it’s always a good idea to kick off with a developer in the room and get a comprehensive understanding of where the project will be affected by certain design methodologies. It’s also worthwhile to consider the development process through every successive stage of design thereafter.
Below I’ve listed a few things to consider as a UX/UI designer that will help you create the best-suited designs for a product:
Modern applications aren’t often built from scratch but rather leverage multiple frameworks and libraries, saving time and cost, and reducing the complexity of the application as a whole.
As a designer, these frameworks might have designs in place which can be used as a base to inspire your custom design, which won’t require the developer to create entirely new style sheets but rather override the defaults.
Consider the following:
An application with a react front-end might leverage a component for data visualisation called Recharts.js and when looking at the designs for the graphs you could potentially model your designs off the Recharts base style, which allows the developer to spend less time styling a graph that looks boldly different and more time polishing the overall experience of the platform.
As a UX or UI designer a lot of the decisions you make will impact the performance of an application, from navigation to layouts to something as simple as a popup. Being aware of these constraints will greatly improve the performance of the applications you design.
Consider the following:
An application with heavy rendering on the native side might work better with a tab style navigation as opposed to a navigation stack, if you clear the processing on the tab action, you’re able to free up processing power on every tab.
You’ve likely heard terms like mobile first or responsive design, these principles are great to prevent you from designing layouts which might end up changing dramatically on mobile, which increases development timelines and complexity.
Another way to go about it is to take some time to study up on the css capabilities and even build some responsive sites of your own.
This will help you better understand the development that goes into your design and ultimately ease up the complexity in development.
As UX or UI designer your job is inevitably linked to development, by empowering yourself to know more about the technicalities of code you will ultimately become a more effective designer.
When to consult a developer?
Whichever process you use to design at every step just ask yourself what the implications will be on the performance of the application. If you’re not able to answer that question. Consult a developer.
So, should design decisions solely rely on development constraints?
Not at all.
Ultimately in the mind of your user the UX is the product, so you should always strive for experience first.
But, there are many ways of achieving your goals in the product design space, and being mindful of potential impacts on development will help you craft an amazing experience as well as a well-performing application.
What you need to learn?
The best place to begin as a designer interested in software and technology development is with front-end languages and frameworks such as:
HTML
CSS
Javascript
React
React Native
Vue.js
This will be hard and frustrating at the start but very rewarding at the end of the day.
