top of page
background yellow v-min.jpg
imac_Qutee_homepage-min v2.png

Qutee - Web UX

iphone shadow.png

Qutee is an opinion-gathering application that allows users to analyze comments on specific topics. Qutee pages serve as case studies to examine a particular subject, such as YouTube channels and the latest video game releases.
Features include:
•  Polling features
•  Comment filters
•  Sentimental rating system


A standard issue with comment systems such as Facebook and Reddit is the difficulty in extracting quality comments from conversations. Users are stuck without a way to filter comments that suit their interests. To resolve this issue, I collaborated with the founder of Qutee to create the first intelligent discussion website of its kind.


My role involved redesigning the initial product which required a detailed approach to defining the UX strategy, IXD, branding, graphic design and copywriting.


To gain actionable insights, we had to understand Qutee's position amongst its competitors. After researching the existing market, we found that Qutee offered the most extensive feature list. Although more features don't necessarily mean a better product, a seamless UX does.


Our competitors were focused on starting debates about single topics without a means to filter the conversation. However, Qutee sought to weave together multiple discussions, intent polling and comment filters to provide extensive details about each topic. 


Extensive web research captured a range of qualitative and quantitative data, driving our understanding of the marketplace and the opportunity to create an innovative polling experience.  



As part of the research phase, I conducted Guerilla UX to capture a glimpse of the target audience. These personas provided user goals and pain points, resulting in a better understanding of the problems we needed to address. 



Based on the persona insights, I began to map out user needs and goals by turning them into user stories. By mapping out the features and functional requirements, the product's scope becomes more defined. 

user stories-min.png


task flow_larger_font.png

The next step was to map task flows within the product. My goal was to reduce the number of steps needed for each user to complete their tasks.  


Task Flow: A new user creates an account to post a comment.


Once the project's scope was understood, I began sketching UI components. Since a project's requirements are continuously evolving, drawing allows me to quickly iterate new ideas. 

desktop sketch-min.png


Wireframe Sketch: A new user visits the homepage (logged out state, above the fold).


After sketching the initial UI, I started creating mid-fidelity wireframes. By using a 12 column grid, I was able to map out the page's architecture. During this phase, it is essential to identify the typographic scale and the proper dimension of each element. 

Qutee_homepage_wireframes-min (1).png


Wireframe: A new user visits the homepage (logged out state).


Accompanying the wireframes, I documented each user story with a UX-flow deliverable. These flows are particularly useful when presenting the complex interactions between core pages. To test the validity of the flows, I created clickable prototypes using InVision to ensure the flows were seamless.



Wireflow: A user signs in to register a new account. 


Prototypes are typically tested during their second and third iterations. Since we wanted to nail the details and iterate quickly, we used Invision to create interactive prototypes. This Quality Assurance cycle allows for testing assumptions and validating them before implementing the final design. 



Once the style guide was in order, I created several variations of the logo. The first design was a wordmark to familiarise the audience with the brand. Since the business was still new, we wanted to ensure that the audience could identify the name before being presented with a brandmark logo.


The second logo, the brandmark, is how we intended to present the brand when faced with space restrictions. Each variation emphasized the "Q" which symbolized the company's theme — "Query tags for accessible data." 



My aim was to create a visual representation of the live screen. This provides a great opportunity to reinforce a brand's colors, typography, and overall style.


Hi Fidelity Mockup: Qutee's Homepage (logged out state).

homepage screencap-min.png


From 0 to over 70 design implementations – that's my Qutee story. But the real impact lies in what it enabled: giving social media influencers the gift of insightful data about their audience. This translates to tailored content, deeper connections, and explosive engagement – a revolution I was proud to be a part of.

bottom of page