What can a developer do to enhance User Experience?

User Experience (UX) refers to a person's emotions and attitudes about using a particular product, system or service. It includes the practical, experiential, affective, meaningful and valuable aspects of human-computer interaction and product ownership. - Wikipedia

Essentially, user experience development is designing an interface with keeping user's perspective in mind. But, people often confuse UI with UX. UI is what makes the system look beautiful, and UX is what makes the system useful. In a typical system, UX drives the UI, and it is the science behind the visuals. It also keeps the user connected with the system.

Before we discuss how to improve UX, let's look at the process of developing the UX for a system. Usually, it has the following flow -

1. Identify system objectives and user requirements - Before starting any development, a developer must understand critical goals and what the system aims to achieve. Along with that, clarity of end-user needs is also essential.
2. Define system constraints - After identifying system objectives and requirements one must apply various parameters such as time, budget, team, accessibility and other factors that affect the system to define the scope of the system. We must keep in mind that, this is an iterative process so we may not achieve success in the first few tries. We must also make sure that these constraints are well documented.
3. Build user flows - Now that we have defined and documented the scope, we need to decide how the end-user is going to interact with the system. A simple way to do that is to build user flows. These user-flows should consider as many use-cases as possible.The simplest way to define user-flows is by using flow diagrams.
4. System interface and information design - By creating user flow diagrams, we have created different patterns for our end users regarding usability. In short, we have defined the intended behavior of our end-user. Now, it's time to bring structure to our system regarding looks. We should decide the placements of elements on the system interface in such a way it requires the least amount of effort to access it. This is ultimately going to help us validate our user flows. We can further cement our validation by creating multiple wireframes and mockups.
5. Build graphic or visual design - Creating graphical or visual design is a process where UI and UX development work together. This is the step where we will add different flavors to make it relishing. When I say flavor I mean, color palettes, themes, templates, images, typefaces, icons, typographical elements, interactive patterns and many more things. Each and every flavor is going to play a vital role in beautifying the system interface. This is where the system will start looking more alive.

   ---

Till now everything was pretty much pedantic, let's make it more exciting and dive into the meaty parts of improving user experience!

1. Wireframe, mockups and design libraries/frameworks - We have already discussed the advantages of creating wireframes and mockups. We can use wireframe.cc, mockflows, moqup.com for creating wireframes. There are many design frameworks available in the market like Bootstrap. Using such a framework is going to provide significant support to create a template system. Choosing the right and customizable framework is the key.
2. Right color combinations - Use eye-catching colors to enhance UX of your interfaces. Good designers use a few theories about colors patterns to make things look good. They usually a follow 60-30-10% color-ratio, which gives balance to the color scheme. Where 60% is the dominant color, 30% is the secondary color, and 10% is for accent color. Check this link, for further details. Color combinations should depend on for how long user is going to use the system. For example, if your user is going to use the system for all day long, then it’s a good thing to have light background and dark text. For visualizing and using right color combinations check out different websites like colors.adobe, coolors, colorcombos.
3. Prioritize data - If you have a significant amount of data to be displayed on the system interface, then prioritize your system requests. You don't want lower priority data to be presented first. It might not affect the users with high-speed internet, but what about those with a slower connectivity? A simple example can be seen on social networking sites like Facebook. If you notice, Facebook always loads the posts/feeds first as it’s their primary information. Other data like Birthdays, Events and Ads are displayed after the posts are rendered.
4. Build a guidance system and documentation - It’s good to have system-related information on the go. Create links for system documentation to explain more about various features. Add FAQs and have a feedback system. Add tooltips and guideline tours wherever needed. Adding social media links can benefit you in multiple ways. You might want to take different surveys from end users, by keeping them interactive, they’ll make end user feel being a part of the system.
5. Discussions or team communication - Have conversations with your UX development team about design patterns, implementation strategies, use cases and user flow. Team discussions often bring new ideas to the table and may also spot a few use-cases missed during the planning.

So, whatever we have discussed right now are baby steps that may help you in the long run. And It’s worth to bring these vital elements to the system development process. It is going to save a lot of time, effort and possibly, even money. So now that we’ve discussed a few Dos, it’s time to look at a few Don’ts. These are the typical mistakes which to avoid while developing a system interface.

1. Avoid dark background with light colored text. Imagine yourself, reading a book, with black pages and white text. That is going to be really scary for your eyes.
2. Try to avoid page reloads.
3. Also, avoid requesting too much information. Isn't that boring to fill out lengthy forms while we sign up? It irritates me when the system keeps asking me more birthday, addresses, etc. This might be valuable information, but you can take that later too.
4. Earlier I mentioned about the importance of user feedback for your app, but we should also ensure that we don’t overuse reviews. For, e.g., asking input in first few days of his/her usage makes no sense. Define your medium for asking reviews, it can be in-app forms or email surveys. Google forms can be a good option. Often, asking reviews from regular users and power users we can get some valuable feedback.
5. Avoid too many notifications and ads which are blocking the page content.
6. Avoid grainy and low-quality images.
7. Avoid too much scrolling unless necessary - If your page content is vast then instead of a scroll, add navigation buttons on the design or implement special navigation panel for that.
8. Avoid displaying repetitive information on the same page. Use precise, short and simple text. Avoid negative statements from your content. Ex, Instead of ‘user is unavailable today,’ you can say ‘user is on leave today.’ Use the services of a copy-writer or online grammar checking tools, like Grammarly, to keep your content grammatically clean.

So these are the few things which we experienced while working on different products at work. We noticed that by adopting these points made a positive impact on the overall user experience of our products, But this is by no means an exhaustive list, and I’d be glad to know more opinions from the community.
What else do you think can a developer do to enhance a User Experience? Leave a comment!

Reference links and further readings -

1. UX Smells - link
2. Better Stakeholder Interviews - link
3. Four Reasons Users Uninstall Apps - link
4. Pattern Libraries - link
5. How to teach yourself UX design link
6. User onboarding tools - link

Special thanks to, Shaunak. For helping me write this blog.