Rephyr, Austin

Real Estate Tech:  Mobile web app design for realtors to manage contracts and collaborate with clients

Julianna Scruggs

CPO, Rephyr

Feedback

....The quality of Ritambhara’s wireframes has evolved quickly since joining our team, which demonstrates what I see as some of her best qualities as a designer at this stage in her career. She is whip-smart, professional and an excellent collaborator. She is determined to become a great UX designer and researcher, and her work ethic is quickly charging her towards that goal.... 

Problem Space

Rephyr is a startup based out of Austin. An online workplace that provides real estate professionals and their clients a single place to manage transactions, converse and share documents. I was focusing on designing onboarding and settings which helped establish design guidelines and brand voice.

1

Overview

Rephyr is a mobile web app which automatically reads property contracts through emails and allows for their management more efficiently.

I was working on designing information architecture with Julianna. I was solely responsible for designing flows for onboarding and settings for Rephyr's mobile web app.

Timeline

Tools

Feb - Apr 2019

Spring Internship

Sketch - Wireframing and Prototyping 
Invision - Collaborating
Asana - Organizing and tracking tasks

Information Architecture

This phase involved:

  • Determining the hierarchy between features and functions

  • Identifying missing features

  • Deciding onboarding flow

infoarch.png

High level flows

A high level flow shows the most important states, without going deep into specific interactions or edge cases. A high level flow helps define the specifications and constraints for the next stage of the process.

 

High level flows were helpful because:

  • They gave us a better understanding of the information flow in the application.

  • They helped us identify what features are missing or redundant.

  • They provided enough information for the developers to start building the backend.

  • They are fast to design. Hence, during the initial phase of the project, when there is a lot of ambiguity, it is easy to modify them.

3

2

1. Onboarding

Acquisition

Sign Up - Out of the product on boarding

Engagement - In app onboarding

Retention

I was focusing on the highlighted problem areas.

Design Challenges 

1.

Making the user stay while the system loads for 10 seconds.

Letting the users set up their profile while the system loads.

2.

Showing relevant content when there is no contract found.

Displaying empty states to educate the user

3.

Complex and long IMAP Login process

Broken down forms with focus on steps and appropriate feedback mechanism

Low fidelity design for the sign up process

Onboarding High Level Flows

Explorations.

Card Slides

Focus on content as well as number of remaining steps.

Full page form

Focus on single page design

Focus on steps

Focus on more breathing

 space, each step and transparency of the steps

Accordion Layout

Focus on a single scroll and natural finger movement

2.

1.

3.

4.

I chose to focus on each step and break down a long form into multiple pages as:

  • Some of the fields for IMAP sign up are rather complex and require more attention of the user.

  • It reduced the anxiety to fill all the details making it a less overwhelming experience.

  • It is consistent with on boarding of popular platforms including Facebook.

2.Settings Module

Designing the settings flows for different user profiles based on the requirements provided by the Product Manager and based on User Research. 

Lessons learned

This project taught me how to deal with ambiguity and work in the real world where circumstances are changing everyday. I tackled this by rapidly iterating on designs to help architect the solution incrementally.
While designing an item for this project, I ensure that my work is well documented as it will be referred by multiple stakeholders.
Also, collaborating with different stakeholders helped me enhance my presentation skills and communicate my ideas better.

4

  • LinkedIn
  • Dribbble
  • Facebook
Onboarding flow for client