DEFINING THE PROBLEM

Problem Space

The choice of hiring the subcontractors with a good reputation for quality work, dependability and being reasonably priced is an extremely important decision for general contractors which will determine the quality of craftsmanship and will minimize emotional stress and unexpected costs. Getting access to the subcontractors is not easy for general contractors due to the inadequacy of available resources which forces general contractors to find subcontractors through conventional and traditional practices such as getting referrals by talking with people who they know and trust. This approach is not always guaranteed and can take a lot of trial and error.

HMW simplify the hiring process for general contractors in order to do their jobs more efficiently?

IDENTIFYING PAIN POINTS

To understand target users within a short period of time, the Lean UX method was applied. The process began with listing out assumptions. By asking key questions based on the users segment (such as what users would hear, think/feel, say/do, and see), while constantly validating the assumptions, I was able to refine these assumptions. From these assumptions, interview questions were complied and some pain points were revealed.

USER PERSONA

Meanwhile, as I was going along with my UX research plan, I started creating the user persona from doing interviews and identifying pain points. Creating User Personas helped to give a reliable and realistic representations of the user. This personas was purely based off of my assumptions and served to inform my design decisions during the initial phase of design and research. I would be validating or invalidating my assumptions again during user research and testing.

EXPERIENCE MAP

After identifying user embarking on the journey, it was time to creat an User Expericne Map and organize the user journey into major stages to understand users experience through their perspective from the beginning, middle and end as they move forward in their journey. To do so, initially, I started the mapping process by defining the major behavioural stages (Project kickoff stage, Recruitment stage, Execution stage and Closure stage) a typical user would go through then more specifically by defining each touchpoint. Subsequently, I explored the user experience (doing, emotions, feeling and thinking) across touchpoints which led to recognising the user painpoints. Ultimately, I proposed opportunities for innovations based on the gaps that showed where in the journey the needs of user were not met.

IDEATE SOLUTION

Through user research period, it was verified that general contractors have had extremely poor experiences with hiring a reliable subcontractor. Accordingly, in this phase of the process, I attempted to propose a solution in order to simplify the hiring process and create a seamless “step-by-step” approach from searching for a subcontractor to asking for a quation.

USER SCENARIO

User scenario helps flesh out user journeys, likely product features and possible screens. It works together with persona by serving as the story behind why the particular persona would use a product. Once I gained an understanding of the users based on the information I gathered during persona research and creation and mapping the user experience, I started to create a scenario featuring user persona and the context in which my application would likely to be used. To do so, I mapped out all the possible epic stories and then decomposed those epics into more detailed steps. Among all the epics that I proposed, I chose the SEARCH epic as the core epic of my application.

Information Architect

Following identifying a core epic of my application, I started to build information architect content model for the main interaction decisions of the user to convey how my application would work from a practical perspective.

Sketching

Preliminary wireframe sketching is a creative approach to exploring possible solutions quickly and conveying design decisions more effectively. It eliminates some of the less promising ideas prior to digital wireframing and allows to try out a multitude of ideas and iterate them before settling on one. In order to connect the underlying content structure or information architecture to the surface or visual design, I explored multiple design directions through sketching. Consequently, I came up with a few potential sketches. After I refined and corrected them through my peer feedbacks for multiple times, then I narrowed them down and selected my best sketched solution.

Digital Wireframe

Moving to digital wireframes was the next step after identifying the best design with a viable layout and flow in the sketching phase. In order to create my initial digital wireframes, I transferred my final selected sketch into Sketch.

VALIDATION

USER TESTING

No one can accurately determine users’ pain points besides the user themselves. In order to validate my proposed solution, I drafted a click through prototype of my digital wireframe using InVision. With this new prototype, I could start a user testing to see whether my design was effective or not and to see how my target audience would behave when using my product. I conducted two round of user testing, in each of which I tested my prototype on ten people. Each user test was documented into a session output to collect feedback notes from the user. key insights from user testings are as follow:

• Providing prefilled feature for the sections that required information from users in order to do less typing.
  
• Adding segmented controller to the screens with long sections and too much content to help users go through those screens without any hassel.
  
• Showing subcontractore's rating in the search result screen visually (by stars) instead of showing it with numbers.
  
• Adding suggestion option as the users type their location.
  
• Changing project location search format form postal code to city and district.
  
• Adding categories take over page in order to help users to keep track of where they are in the search page.
  
• Add a bottom navigation bar.

Iterations, Iterations..

After conducting user testing, there was a never ending process of iterations. The design and process can continuously change, and there is always a solution that can be better than the last. Based on the user testings and validations made, many iterations of wireframes were created with features that were added and taken away before creating hi-fidelity wireframes.

Hi-FIDELITY MOCKUPS

INVISION PROTOTYPE

click to explore

UI STYLE GUIDE

colours | fonts | style

VISUAL IDENTITY

LOGO DESIGN

APP ICON

BRANDING

NEXT STEP

Moving forward, I will be adding additional epics, such as setting up projects, managing saved trades and profile component.