Pixel Taxi | The importance of UX/UI Research in the age of mobile devices

Left part of a laptop screen showing a logo of Perma Groove and a part of the website page

Problem To design websites that could adapt to new platforms and screen sizes, using unfamiliar technology, while maintaining high standards of aesthetics and professionalism.

Solution Leverage key skills in design know-how, systems thinking, client liaison, business development, research, UI and UI Design, user research, prototyping, and UI design to create visually appealing and responsive websites that meet the needs of small businesses and their customers.

 

R&D industry collaboration

Client interviews

Card sorting/Information architecture

Sketch prototyping

Unmoderated usability tests

Device testing

Research Methods



It's really important to have opportunities to learn and improve our skills. When we had to build websites using new technology, we realized we needed to learn quickly. So we joined a group called ‘Be Responsive’ in Melbourne, where tech professionals could meet up and learn from each other. We attended presentations, asked questions, and shared our own experiences. This helped us overcome our own challenges, learn new things, and get tips to use in our own work.

R&D Industry Collaboration


A sketch of a conference. A woman is standing in front with a board behind her. She is facing six people seated
 

When we started a new project, we talk to the client. This helped us understand their business, who their customers were, and any issues they might have with their current website or app. We ask questions and gather information to help us do a better job. We found it's important not to avoid these conversations, even if they might be difficult to schedule.

Client Interviews

 

Even if a website is small, it's important to have a clear and logical structure for the information it contains. To do this, we used a method called "card sorting" where we wrote information on Post-it notes and organized them into groups based on how they fit together. Then, we drew a diagram of the website's structure based on these groups of notes. This helped us make sure the website was easy to navigate and find information on.

Card Sorting/Information architecture

Sketch of a three-tiered chart. Top tier is labeled as Home. Middle tier has boxes labeled as Services, About, and Contact. Below the services box are two boxes labeled as Consulting and Design
 

Before we started working on the visual design of the websites, we would work together to design the basic functions of the site. Since we were using new technology, we wanted to combine our knowledge of design and technology to come up with quick, rough ideas. We did this to generate more ideas and to make sure the site would work well.

Sketch Prototyping/Co-Design

On the left is a sketch of a computer screen showing sample layout design for Perma Groove. On the right is a sketch of a mobile phone screen showing showing texts about Perma Groove and its website menu
 

Design systems help designers and developers create consistent user experiences. When working with a responsive grid, I made sure to follow consistent typography guidelines while also making sure that the websites I created were flexible.

Visual Design

 

To see how easy it is for people to use your website, you can have them test it out and record their reactions. We used Peek User Testing (now called UserTesting) on all our websites. Testers tried using the site while we recorded their actions and comments. These recordings helped us find small issues that we may not have noticed, which inspired us to make more changes and improvements.

Unmoderated usability tests

 

We made sure that our websites worked well on different devices, like phones, tablets, and computers, by testing them out. We also used online cross-browser and cross-device testing tools. We couldn't test every possible combination, but we made sure our sites always worked on four major breakpoints.

Device testing

 

A landscape of responsive sites Pixel Taxi aimed to create templates for websites that would automatically adjust their layout to fit the visitor's device screen size and orientation. Through utilising design research Pixel Taxi was able to help many businesses transition to mobile devices, which greatly improved the user experience for their customers.

Conclusion