• Work
  • Info
Lillian Crandall
  • Work
  • Info
MainImage.jpg

Rove Loop

A NEW DIGITAL PLATFORM FOR AN EMERGING ECO-FRIENDLY, FLAT RATED RIDE SHARE SERVICE

Rove- the first of its kind- is a luxury ride share service utilizing Mercedes Benz Sprinter Vans vans to provide nonstop transportation between downtown Manhattan, Brooklyn & the Hamptons. After a successful launch in the summer of 2019, my client sought a way to provide transportation to customers all year around. So, I give you "Rove Loop", a new app based ride share service utilizing moderate speed eco-friendly electric vehicles to provide flat rate transportation to passengers traveling within a close proximity (2-3 miles) of a centralized location. The current three zones are Sag Harbor, Montauk and Southampton. The app was initially scheduled to launch in May 2020, but due to COVID-19 there have been some setbacks and the new launch date is TBD.

The research, design and ideation for the app was done completely by me whereas the back end development was outsourced by a team in Los Angeles. Based on my experience in web development I was able to cohesively work alongside the developers and help the team maintain the ultimate goal of creating an aesthetcially pleasing, easy to understand experience for both the rider's side of the app as well as the driver's side.

Screenshot 2019-11-07 15.48.12.png
Screenshot 2019-11-01 13.17.10.png
First concept design for the customer front end. As you can see, the transitions needed to be a lot smoother and the interface seemed very outdated which helped lead us to the final product visually.

First concept design for the customer front end. As you can see, the transitions needed to be a lot smoother and the interface seemed very outdated which helped lead us to the final product visually.

RESEARCH AND IDEATION

The team was ultimately just my client and I on a day to day work basis. The process consisted of my research done on Material.io, case studies of similar apps and their areas of success as well as their shortcomings.

The wireframe stage is below. Due to time, project budget and the number of team members, this process was more of a "first trial" rather than a traditional wireframe, which was helpful in creating the final product because we were able to learn what worked and did not as we went along.

Programs Used:
Principle was used for the first iteration of the app, which allowed me to get a better understanding of the pros and cons to development softwares. Principle is good for creating transition animations, but limiting when it comes to the "prettiness" of the design which is why for the second iteration I used as it is also easier for collaborations with developers.
navigate.jpg
Initial walkthrough explaining how the app works

Initial walkthrough explaining how the app works

PROBLEM SOLVING DESIGN RE-VAMP

The main concept of Rove Loop was not portrayed in the first iteration and therefore I made the decision to alter the overall design to better fit the clients goal.

First Iteration:
  • Incohesive flow
  • Lacked info on how the app works
  • Did not display the zone rate effectively
  • Built in Principle making it harder to collaborate with developers
Final Iteration:
  • Updated logo
  • Inital walkthrough more concise/accessible
  • Clearly shows whether you are in a zone
  • Displays zone rate at the top
  • Fresher and newer design to stand out from competitors
  • Built in Figma, allowing a smoother workflow for the developing team
Updated “where to?” panel clearly highlighting that you are in a designated zone.

Updated “where to?” panel clearly highlighting that you are in a designated zone.

Clear display of what riders see when they are not in a covered zone

Clear display of what riders see when they are not in a covered zone

Splash Screen AnimationPrograms Used: After Effects, Illustrator, Photoshop

Splash Screen Animation

Programs Used: After Effects, Illustrator, Photoshop

Frame 1.png Frame 2.png Frame 22.png Frame 20.png Frame 13.png Frame 18.png Frame 19.png
 

Driver’s Front End

Frame 1.png
Frame 3.png
Frame 4.png
Frame 5.png
Frame 6.png
Frame 20.png
Frame 21.png
Frame 22.png
Frame 24.png
Frame 25.png
Frame 26.png
Frame 27.png
Frame 28.png
Frame 29.png
Frame 34.png