Collage of images. One of a white woman (me) working on a computer, a digital mood board, a cardstort on glass window, a screencap of an search input screen, image of three people presenting project results.
The ProjectĀ
REA Spaces was a group effort between myself and two other UX Designers from General Assembly. We were approached by ārepresentativesā of REA (our instructors, not real REA staff members) with the following brief:
Left: white text detailing "REA short lettings expansion key objectives: expand into the short lettings arena; Provide a desktop website; Generate revenue from commission; Facilitate the entire process of property listing, booking and financial transactions. Right: A blonde woman holding an iPhone outdoors.
Developing Personas and User Flows
After having a look over the brief, some questions were posed to the client. The team began by brainstorming who our target demographic would be for this service. Would they be looking to target couch surfers or business people working remotely?
In addition to concerns regarding the target market, there were questions about how to position REA within an already-existing market without damaging their very strong brand in any way. The clients expressed that they were seeking to develop a website that would target both short term accommodation as well as office space rentals.
The target demographic for both accommodation and office spaces was repeatedly described as ācorporateā as well as ānot hippieā. One of our biggest takeaways from this meeting was upon whom we should focus. I cross-referenced our perception of an āideal userā from the businessā perspective, with some demographic research about who is currently browsing the REA website regularly. Using this information, we developed the following personas, one for renting and another persona for hosting: Ā
The target demographic for both accommodation and office spaces was repeatedly described as ācorporateā as well as ānot hippieā. One of our biggest takeaways from this meeting was upon whom we should focus. I cross-referenced our perception of an āideal userā from the businessā perspective, with some demographic research about who is currently browsing the REA website regularly. Using this information, we developed the following personas, one for renting and another persona for hosting: Ā
I greatly enjoyed envisioning and developing these personas.Ā My teammates and I began to refer to them affectionately by their names throughout the course of our design sprint. Ā
Once our personas were developed, we set about developing two user flows. Oscar would be looking for short term accommodation in his move to Melbourne, whilst Bob and Alice would be listing their property. My teammate Oliver, focused on Bob and Aliceās hosting flow, which you can read about here.
Collage of images comprising a moodboard. Including images of Melbourne landmarks, interior spaces, and screencaps of competing services' websites.
Design Studio
To begin tackling the design elements of our challenge, my teammates and I performed some competitive and comparative heuristic evaluation, to determine what elements we favoured from similar websites. We all found the UI of AirBnB to be the most ascetically pleasing, but as the refrain of our project would become āwe are not recreating AirBnBā.
White paper and colourful note cards attached to a window, with black inked wireframes and handwritten text.
Following the heuristic evaluation process, our team began with a design studio approach. This collaborative effort allowed us to identify a number of design elements that would be the guiding forces behind our design. From our design studio, we developed a search functionality focused on language, that would allow our users to browse both accommodation or office rentals.
A screen reading "I want to [blank] in [blank] from [blank] to [blank]" with dropdown menus in each blank space. A red search button with white text follows the sentence.
This was a huge coup for us, as it allowed us to serve both desires of our client, in a way that we had not previously envisioned.
Additionally, in our design studio, we developed a search option that focused on a three panel functionality, which became a standout element of our final design.
Prototyping
As the group member with the greatest amount of visual design experience, my position in this project was to develop medium and high-fidelity wireframes. I began by doing an assessment of the REA brand and developing a brand book and mood board (as seen above).Ā Ā
After developing an initial series of wireframes, my colleagues performed multiple rounds of user testing on both the renting user flow, as well as the hosting flow. Taking into account the feedback from these tests, we performed a MoSCoW assessment and determined what our MVP must entail.
Three panels of high-fidelity wireframes side by side, showing the evolution of a page listing as the result of user testing.
User Testing and Iterating
Above are three iterations of the residential listing page. The first iteration on the left was a direct result of digitizing our design studio. The middle iteration came prior to direct user testing and resulted from our group self-assessing the information we were providing to our users. We determined that users would want more information about the property suburb, and would also like the pricing structure to be presented differently. The third iteration was a direct result of our user testing. Our users were unclear about the calendar functionality and wanted more information regarding guest reviews and suburb amenities.
A high-fidelity mockup of a website page. A large image of a loft style apartment spans the top. Underneath is dummy text regarding a potential listing. RIght panel included a calendar and price calculator.
The final wireframes for which I was responsible, include the following:Ā
Screencap of multiple high-fidelity prototype screens.
Success Metrics
ā¢Ā As this is a new site we can measure how successful this is by recording how many listings and rentals generated over a 3 month period.
ā¢ The revenue received from the 10% commission from Rental and Hosting, if all went well would cover the costs to the business for the design, construction and implementation of the new REA Spaces website.
