Skoop moves bodies & brands. Skoop specializes in mobility advertising.
Their electric bike taxi fleets move passengers from point A to B. Each vehicle has digital advertising displays attached to the exterior and interior. Their screens are always on the move displaying advertising content around town, subsidizing the cost of the ride for the passenger.
Designing a digital web & mobile interface at Skoop.
Role
UI Designer & Brand Strategist
Team
1 CEO
1 Social Media Advertising
1 Graphic Designer
Year
February 2019 – May 2019
The Challenge
- Understanding which current users want a mobile experience.
- Designing a mobile experience for riders, as well as a web experience for advertisers.
- Communicating with developers to make sure designs were implemented perfectly.
Our Approach
- Interviewing riders and company advertisers, and creating user personas based on interviews.
- Practicing agile design workflows, as well as staying one step ahead for next versions.
- Design, test, and build a mobile app and a web portal using Sketch, Figma, and Swift.
Gathering research, understanding our users
These bikes ultimetly helped us conduct gorilla user testing
When it came to understanding Skoop’s users, it was easy. The product itself –
the bikes, had already been launched for roughly 1 year. The next goal was just to build a digital interface that would make it easier to find a ride, similarly to Uber’s and Lyft’s apps.
We conducted interviews and learned these 2 things:
- Our users were looking for something quick – quicker than Uber.
- At the start, they were mostly college students looking to get to class quicker and cheaper than what an Uber could provide.
At this point we started to create user stories and build a digital brand around the feedback we got from our interviews. We then started to sketch out what our mobile product was going to look like.
“In my role as a college student, I need a quicker & cheaper alternative to getting to class.”
“In my role as a small business, I’d like a way to advertise my business locally for a cheap price.”
We used these user stories to start sketching our first iterations
First iterations
We started off by breaking down our user stories to really understand what our users wanted when it came to early features. Some of those features included finding the nearest Skoop to them, scanning a qr code to get into a bike, and being awarded rewards for using Skoop, which ultimetly became deals from local advertising partners.
Some of our early sketches and ideas
Finalizing our mobile experience
When I first joined the team, the mobile digital product was a simple idea, however, with a lot of research, determination, and simplicity, we desigend and built a beautiful mobile interface. The goal was to balance white space and still use pops of the Skoop blue to attract the eye. We used cards to create organization of the information as well as different shades of black and greys for contrast. What you see below are some of the final screenshots we used for the first build of Skoop Mobile Version 1.0.
Finalizing our web experience
Once we tackled the mobile experience, we felt very confident going into the web interface. We started off with a very strong idea as to what our advertising partners needed to advertise their brands. We designed and built a seamless web flow that follows the same digital brand as the mobile app.
What you see below are the final iterations of the website before development began.
