Challenges working as a UX Designer
Peeking into the daily life of a UX Designer
(This article is originally by Valerie Blackburn and has been re-posted on medium with her consent. The link to the original LinkedIn article can be found here. Visit Valerie’s website to view her portfolio.)
The five main challenges of UX design are listed below. This list is comprised of what I have faced working with corporate and personal clients as a UX Designer.
- Adequately researching client needs
- Accessible design for all browsers, devices
- Formulating a focus group
- Coding the front end for developers use
- Keeping the design or code base consistent
Adequately researching client needs
One of the most challenging, yet rewarding parts of UX Design is the research phase. It is imperative to research both the competition in the chosen industry and current trends to achieve the best possible design.
For instance, when redesigning a large payroll application, my first inclination was to research online all the competing payroll companies in the industry.
First, to learn about payroll design and the process. Second, to learn from the competition. What was the competition currently implementing that we could in the future, or what could we more successfully implement?
Then I researched what the industry as a whole was doing. What were companies like Apple and Microsoft implementing in their user interface designs? What was the current style? Examples: Microsoft flat surface design or Apple’s minimalist design.
How had these companies successfully applied this design to their signage, retail store fronts, television commercials, websites and web applications?
Then, I reached out to those companies as if I were a new customer purchasing their services. This was to learn about how the company communicates with its perspective consumers.
How could our company borrow ideas, or improve upon this process? What were some of the creative ways companies were using to attract consumers? What incentives and promotions were we already implementing or could we in the future?
As part of the redesign process was working in conjunction with the product management team, part of the research phase involved researching the payroll product(s). When researching competitors online, what stood out about the product, how was it like or different from our own payroll product? What made the product appealing or validated the need to buy? From this research, that was shared with the product management team, what could we implement to make our product offering more appealing and user friendly to potential buyers?
Accessible design for all browsers, devices
Another challenging part of UX Design is designing an interface and developing code that is compatible with all browsers. With a product that has a diverse consumer base, such as payroll (small, medium, large businesses, single users, large corporations) certain users were accustomed to older browsers such as Internet Explorer.
Upgrading to a newer browser or computer that was compatible with a newer browser may not be in budget.
This meant the design had to be simplified to include older browsers. What would a designer or developer do when the icon being used for a major payroll function couldn’t be viewed in an older browser? Was there a way to come up with an alternate solution and code the page to view the alternate image when in an older browser?
If this would require extra time from the developer, then it was all the more imperative to have this knowledge during the mock up phase of the redesign. A UIUX Designer or UIUX Developer could then communicate this need to the development team.
Of equal importance to browser compatibility is device compatibility. Applications and web pages don’t appear the same from device to device. As an example, an icon in the main product menu may appear small and rasterized on a cell phone device, then clearly concise on a PC desktop.
One solution I proposed as UX Designer to solve this issue was to convert all images to SVG’s so that they would resize on each device without compromising the quality of the image. With the use of SVG technology as a snippet of code, rather than an image itself, the icon would seamlessly appear in the same resolution on any device.
The code would be read by the browser and resize the image to fit that specific device, rather than a designer having to create multiple images and a developer having to code for those separate images. This is just one example of how to achieve valid device compatibility.
Testing for browser and device compatibility
A large part of designing and developing applications and web pages that are compatible involves testing the code on various browsers and devices. This is a standard part of each phase in the design process (from design, development, to product release). One person, or an entire team, can be tasked with testing.
How does the product menu appear on an iPhone 9 in the Safari browser, as compared to a Microsoft Surface tablet in the same browser? How did the payroll function perform on a standard Apple desktop with an HR representative vs. on an Apple iPad in a different browser?
The results of these tests were then recorded. These results were communicated to the development team, who was then tasked with coding a responsive solution. Example, a what if PHP statement may be needed to make the payroll function perform the same on the Apple iPad as it does on the Apple desktop.
Formulating a focus group
An important part of designing with the user in mind requires formulating a focus group. This can be done internally or externally within the company. One of the challenges with a major payroll redesign was a confidential work environment. This meant that an outside focus group would not be possible and had to be acquired internally.
Since the company already dealt with payroll and knew the process well, a large pool of candidates were available to join the internal focus group. Workers from the human resources, customer service and sales department(s) were gathered to focus on questions already compiled by the development team.
For instance, “Did the user click the top menu to find the payroll page or did they access the left side menu first?” If the majority of users clicked the top menu, then the development team would know to focus on that menu as the proposed solution. These workers were invaluable to the redesign process in determining improvements for each new development release.
Coding the front end for developers use
Another important part of design is front end development. A back end developer may be able to code expert functionality into the application or web page. Yet, they also need a solid amount of front end code in place to do so.
A UIUX designer or UIUX developer that can code accurately and within current code standards becomes an important link from the design to development phase of the project. Code that is readable, responsive and tested before implementation is needed to achieve optimal development.
Considering the back end development needs is also an important step of this process. Will the back end development team need more time to develop a solution on a certain page? Adding notes in the code help make the process more efficient and allow for adequate communication between a front end and back end developer.
Keeping the design or code base consistent
In my opinion, the most important part of a redesign is keeping the design or code base consistent. A large redesign, or any project for that matter, requires a vast amount of steps in the process.
How will the original branding be implemented or change with each step of the design and development process? If the branding is to stay the same throughout each phase of the process how can this be communicated to the entire team?
One way to achieve consistency is to develop a set of style guidelines. Most companies either already have a set of style guidelines (such as branding or marketing guidelines) in place.
How can the branding or marketing guideline materials be used to develop a set of style guidelines for the code? A document that communicates what the style guidelines are helps to keep the entire team consistently designing and developing on the same page.
Perhaps, a live prototype is necessary to communicate the style guidelines more effectively with the development team. Will a framework help ensure the development team codes using the same language and style? This will ensure that any future code changes are made within the parameters of the framework and style guidelines.