Working with UI and UX Designers as a Developer
As developers, especially those working in front-end development, we will have the amazing opportunity to work in collaboration with UI and UX designers. An important part in making this collaboration successful is understanding each other’s processes and scopes, so that we can work harmoniously with one another to create a successful product. Many major companies including Amazon, Google, Facebook, IBM, LinkedIn, and Uber are doubling their UX UI design professionals, so it is very clear how important it is for us to work together. In the end, we both want the same for a client — a highly functional app that appeals to the user, with a seamless user interface and simple ease of use. In order to make this happen, we need it to be very clear what UX and UI designers actually do.
What is UX Design?
UX Design stands for User Experience Design. The role of UX Designers is to ensure not only product functionality, but also a seamless experience for clients. A UX designer’s process is successful because the designer prioritizes their target audience. UX Designers work primarily on digital products, so it is a given that we will be working together. One cannot survive without the other — we need UX designers as much as they need us.
The UX Process
“Connect business goals to user’s needs.”
UX Designers focus on functionality, usability, and user adaptability. One of the most important things to take away from this is understanding the designer’s process.
- Strategy: gain context for the product, how you will structure your product and develop content, define your mission/ goals, and set your priorities
- Discovery: get to know your customers and your competitors, analytics review, see what else is out there
- Analysis: look into user cases, story board, map out how a user will interact with your app, create a workflow diagram
- Design: create a mood board, outline layout of product with site map, sketches, begin wire-framing, prototyping, user testing
- Production: integration, analysis, iteration, continue with prototyping, beta launch, user testing, launch
What is UI Design?
UI Design stands for User Interface Design. One of the recurring jokes for UI designers goes something like this:
“If you have to explain it, you didn’t do your job well.”
Simply put, UI Design has to be intuitive. If the user struggles with how to interact with a product, then it is the responsibility of the UI Designer to do some more research and implement some changes.
The UI Process
The UI Design process is a little more condensed than the UX process explained above, although this does not mean that one is more important than the other. UI, UX, and Development all share equal importance and must coexist.
1) Look and Feel: customer analysis, design research, user stories, branding and graphic development
2) Responsiveness & Interactivity: prototyping, interactivity/ animation, responsiveness, implementation with developer, testing, prototyping, beta testing
3) Rinse and repeat. Repeat the first few steps forever and ever.
UI Designers work rigorously and consistently to maintain a user interface. There is a never-ending cycle of the process since there are constant updates being made to digital products.
Role of Developers in Collaboration with Designers
If the UX and UI Designers are not developers themselves, then this is where a software engineer comes into play. Don’t get me wrong — there is no hierarchy here, as both developer and designer can contribute their skills to an end product. Designers specialize in what makes sense for the user, and developers specialize in what makes sense for the computer.
UX Development is starting to encapsulate the responsibilities of UI Development. Developers in this field now create front-end web applications and implement best practice for cross-browser compatibility, as well as accounting for responsiveness. In addition, they also consider a larger scope in solving user problems, incorporating illustrations, interactive design, and 3D graphic design into the web applications. The most popular frameworks for UX/UI Developers include AngularJS and React JS Frameworks, and popular languages include Javascript, JQuery, and HTML/CSS.
Follow the Trends:
Single page applications and progressive web applications are growing in popularity due to their quick render time and flexibility to be deployed across a variety of platforms and hybrid applications. Progressive web apps in particular are on the rise since the mobile web app market is oversaturated, and mobile apps can easily get lost in the masses. Instead, a user can open a web page in the browser, then add it to their home screen to use as a mobile app. The Washington Post has a great PWA to check out. In addition to these trends are E-commerce, AI Bots, Blockchain, Internet of Things, and Motion UI. This article describes the top web design trends for 2019.
Don’t let the little things slide:
Sure, we were able to position the text by adding 30% padding, 0.5 em of margin, and 20% transformX. But, the UI Design will not be optimized across browsers and, surely it definitely will not be easy to work with. Be neat and precise with your code, and address UI issues immediately.
Work together with the designer:
- Begin with a visual hierarchy, dissecting the information that the business wants displayed on the page. Identify what is most important to the user and emphasize that over other content on the page.
- The developer and designer need to work together from the beginning to understand the strength of each other’s capabilities. They need to frequently pair together in their work, and make sure everyone is on the same page. This means working on the same element at the same time, be it a form, div, or simple text.
- Find shared ways to achieve the same goal, such as sharing files with Zeplin.
- Design one step ahead. This ensures that all great ideas are documented, and minifies the amount of work that goes to waste. No one wants to their three days of work to never see the light of the web, so make sure you communicate and plan ahead! This provides a great sense of direction and keeps both designer and developer on track.
Conclusion
Both designer and developer are integral to the success of a business. Together, they share a goal of creating a “rewarding and delightful experience” for the user, an experience that keeps the user coming back to the app and telling all their friends about it. It is without a doubt that a successful product is the outcome of two strong collaborators working in harmony.
Resources:
