UI/UX Design Principles at a Transportation Startup & Beyond

Written by Matt Stein, Director of Product Design at Metromile

I’ve been at Metromile for about ten months now. It’s my first startup and in short I love it. Previously, I led design for the Salesforce Community Cloud and was all things AutoCAD during my time at Autodesk. The biggest thing between the two previous companies and Metromile is size and maturity. They are big goliaths! Metromile is small and nimble. I joined Metromile as employee 65. There was an existing design team doing great work and my primary goal was (and is) to elevate design at the company, incorporate strong design processes, and be the champion for the user.

In my relatively short time here we have accomplished a lot; an app redesign, refreshing our quote and enroll flow (have you got a quote yet?), new processes, visioning weeks, new state launches, and hiring hiring hiring (which deserves a blog post unto itself). It’s been an amazing whirlwind that I could not be more proud to be a part of.

Looking for a tech job near you? Check out the Tech in Motion job list.

Along the way I have learned a lot and have tons more to learn. Every day poses new and interesting challenges. Below is a little insider info into UI/UX design from me, and teaser of some of the topics we will be discussing at the panel event on Feb. 25 hosted at Metromile’s offices.

What are the three UX principles that are most important to a transportation startup? Why?

Three principles, beyond the core principles of intuitiveness, ease-of-use, and others, that we keep in mind are “Glanceable”, “Clarity”, and “D.E.F.”:

  1. Glanceable – People aren’t using our app like Facebook or Instagram. They open the app to see where there car is, view their last trip, check their fuel gauge, etc. That information needs to be at their fingertips.
  2. Clarity – Secondly, it needs to be clear. There is a lot of data about your trip. What do we show you, what do we not show you. What’s that sweet spot.  Don’t show information just because we have access to it. Less is indeed more.
  3. Delightful. Engaging. Fun.- This is kind of three in one, but how do we make using the app a delightful, engaging, and fun experience. How do we get the user to like the app so much they want to go and tell their friends. This comes down to both features in the app and how we go about design. Our street-sweeping feature is a great example. People are alerted to a possible ticket and are delighted that we have saved them money.

How do you delight and engage your users?

Taking a step back, we’re taking something like car insurance, which is typically dry, and making it fun and engaging. Our first goal is always to get you the information you need or enable you to complete a task. Many Metromile customers are actually delighted by our feature set alone. Street sweeping, which I already mentioned is a great example. The ability to see the amount of fuel left in your car is another.  Outside of specific features, the design team looks for touch points where we can add delightment and engagement. One opportunity we had with the Metromile app was our use of illustrations for empty and loading states.  These illustrations are fun, reflect our brand, and tie together the online and app experiences.

Metromile

In an exploration of our dashboard redesign, we’ve been able to do some really fun stuff that infuses our brand with your car.  If you drive a Prius, you will see your Prius in our illustrative style above your policy info. If you have a Mustang, you will see your Mustang in our illustrative style. It’s not realistic that every car will have a specific illustration, but we are hitting the most popular among our user base. We could have just had a generic car avatar and left it at that – but in user testing, the look you see on people’s faces when they see their own car pictured is just awesome (that’s the delight factor!).

What is the most recent change you have made to your design process? Why?

The team recently read a great article by Scott Hurff about designing for the whole user interaction stack – basically every state of a user’s interaction. You might be thinking, “Yes, this is obvious,” but too often anything other than the base or ideal state is overlooked. It is an afterthought for design and development. Scott goes into great detail about many examples of Partial, Empty (Blank), Error, and Loading states.

We brought this idea into our design process for a new project and changed this around a bit. We call it BLEEP, which stands for Base, Loading, Error, Empty, Partial. It guides the designer and team to think about all of these different states from the beginning. Too often everything but the Base state is overlooked or an afterthought.  This puts it in the forefront. It has also helped to develop a common language between design and development. BLEEP is just part of our product development process now. Plus the name is cool.

If you’re interested in hearing more about UX/UI Design in the Transportation Space, join me at the next Tech Talk, Feb. 25 from 6-8:30 p.m. at Metromile (690 Folsom Street). RSVP here.

Attend an event on UI design or other tech topics in a city near you.

 

MattAbout Author

Matt Stein, Director of Product Design, Metromile

Matt champions the user’s needs across mobile and web products as the Director of Design at Metromile. Before that, he was the Director of UX at Salesforce for the Community and Chatter products. Matt has a Bachelor’s in Computer Science from University of California at Santa Barbara.

“Purchase With an Impact” Brings Clean Cooking, Energy Worldwide

Back in January 2015, the New York City (NYC) chapter of Tech in Motion welcomed Brooklyn startup BioLite to come demo at their “Demos & Drinks: Travel & Adventure” event. Not only did the demo company knock it out of the park, but NYC members are still talking about what an engaging and revolutionary product BioLite presented while in the process of launching.

Want to demo your app or product at a Tech in Motion event? Contact us here.

Since then, BioLite has grown into a dynamic social enterprise that develops, manufactures, and markets consumer energy products for off-grid communities around the world. While it still utilizes patented thermoelectric technology that makes cooking with wood as clean, safe, and easy as modern fuels, it has rapidly expanded its line of products from three to 15 unique items that simultaneously aid in outdoor activity while charging small electronic devices.

The beauty of BioLite’s line of products lies within their versatility and simplicity of use. Once the initial investment is made into the hardware, materials to put the product to work are nearly ubiquitous and costless. Take, for example, Biolite’s classic CampStove. By using wood to produce a smokeless fire, users can cook over kitchen-grade heat while the energy produced through fire is simultaneously able to power small electronic devices, like phones and USB flashlights.

Find jobs at startups before they boom by looking at our job boards.

Additionally, BioLite is a “purchase with an impact.” At the heart of the company is desire to do good through a sustainable, eco-friendly product. As such, a portion of each sale goes toward bringing clean cooking and energy to in-need communities across India and sub-Saharan Africa.

BioLite recently received $5 million in funding from six investors, and is working on launching a new line of cookware, solar panels, and small lights. For more information or to keep up with BioLite’s growing success, please visit http://www.biolitestove.com/.

Interested in prior demo events? You might be interested in:

“Teach Through Play” Hops Border and Language Barriers

DEMO COMPANY SPOTLIGHT: ThinkFun, Inc.

ThinkFun, Inc., originally known as Binary Arts, is an Alexandria, Virginia-based educational toy company. Founded in 1985 by Bill Ritchie and Andrea Barthello, the company has since been featured in the New York Times, TechCrunch, and Wired, while also winning many awards for their games. The company is on a mission to “Teach Through Play” and neither borders nor language barriers will stop them: their games are sold in over 60 countries and have been translated to over 20 different languages.

See demos from awesome companies by clicking here and joining your local Tech in Motion branch.

With a catalog of over 70 games throughout its history, ThinkFun, Inc. continues to innovate and remain relevant. 2014 saw the company release the game Robot Turtles (one of the most backed board games in Kickstarter History) followed by 2015’s Code Master, with both games sharing the intent of teaching children the logic and problem-solving mentalities needed to be successful at coding.

Looking for work in coding? Apply here.

For 2016, the company is making its rounds to toy fairs and gaming conventions alike in promotion of their newest game, Escape the Room, a logic-puzzler that is based on the internet and real life sensation.

If you want to meet ThinkFun, Inc., up close and personal, you can find them on February 25th at Tech in Motion DC’s Demos: EdTech Edition. Otherwise, you can learn more about them on their website.

Interested in the intersection of technology and education? You might be interested in:

DC launches into 2016 at Penn Social

Tech in Motion closed 2015 with a 3 month stretch of flagship events that included DC’s 1st Annual Timmy Awards and the nationwide 50,000 Member Celebration: a Big Party for a Big Thanks, which was celebrated in 10 locations throughout the U.S. and Canada. Last month, DC’s chapter of Tech in Motion welcomed its members to a laid-back mixer kicking off 2016, less than a week after the nation’s capital was buried under more than two feet of snow.

Starting around 5:45 p.m., members descended the stairs into the basement of Penn Social, a DC bar in the heart of Penn Quarter. Once downstairs, members found more than 30 draught beers, many childhood game favorites such as giant Jenga and Connect 4, an open floor for dancing (or cornhole) and their fellow Tech in Motion members! The bar advertises on their website that they “specialize in fun” and fun was certainly had by all.

Between rounds of shuffleboard and foosball, conversations were had and connections were made. Due to the snowy weather, many of the guests hailed from DC Proper, though that didn’t stop a few from Southern Maryland or Northern Virginia, and even one guest visiting all the way from Seattle!

Looking for a new tech job? Find one on the Tech in Motion job board here.

Agency tables for Tech in Motion sponsors Workbridge Associates and Jobspring Partners were buzzing all night, as guests seemed excited at the prospect of finding a new job – perhaps as a New Years’ Resolution.

The crowd showed no signs of dying down at 8 p.m. when the event officially closed, so the festivities proceeded unhindered. Although the check-in station was shut down and the agency tables were cleared, the conversations continued and Penn Social was more than happy to sate the guests with a wide variety of drink options, while the connections kept them mentally stimulated.

Upon the official close of the event at 9 p.m., there were lots of empty glasses and more importantly – smiles.

Attend a free Tech in Motion event in your city.

Next month, Tech in Motion DC goes back to school with an Education Technology-themed Demos & Drinks event. To find more information about the event or to find another Tech in Motion chapter near you, visit the official site.

Brews, Views and Networking in NYC: January 2016

At the end of January, over 150 Tech in Motion NYC members gathered at The DL Rooftop Lounge for brews, views, and some world class networking. Despite impending Blizzard Jonas, the bar filled with technologists, tech enthusiasts, and job seekers.

Surrounded by The DL’s iconic greenery and center bar, the DJ spun an original mix to set the mood for some active networking. The moon shone bright through the glass roof as groups clustered around the bar and in the peripheral couches, networking and sharing inspiration.

A variety of motives had driven members old and new to the event. Some were there to network with like-minded professionals, while others arrived with what might be the next big idea, hoping to speak to potential developers. Innovation was in the air as ideas were exchanged on the tropical rooftop.

Interested in taking the next step in your career? Check out these tech jobs near you.

On hand were professional tech consultants from Jobspring Partners and Workbridge Associates to offer insight into the current state of the market. With over 200,000 jobs in the tech industry in NYC—and over $1.3 billion in investment money to be had—having seasoned professionals on hand was invaluable.

“Jobspring Partners and Workbridge Associates are the proud creators of Tech in Motion Events,” said Sloane Barbour, the Regional Director of the two, “and as such, we strive to provide current insight on both the market and the art of searching for a job.”

At the close of the event, it was clear that members from a bevy of backgrounds had battled the weather to attend Tech in Motion. From journalists to investors, technologists to founders, connections were made across the board, and our attendees made their way to the after party down the block.

Check the event list for the Tech in Motion event coming to you this month.

7 of the Best Super Bowl Commercials From Tech Companies

With Super Bowl 50 nearly upon us, viewers across America are preparing for one of the best few hours on television: the Super Bowl commercials airing between plays. Super Bowl ads have historically been dominated by beverages and cars, but tech companies are making a bid to change that. In honor of technology taking over even the Super Bowl programming, here’s a preview of some Super Bowl 50 commercials from tech companies, and a few of the best from the past.

2016 Tech Company Super Bowl Commercial Debuts

LG, 2016. Actor Liam Neeson steps into the future and debuts in LG’s TVs with OLED technology.

T-Mobile, 2016. “Unrestricted Bling.” Well played, T-Mobile, on the rebuttal of recent commercials from other mobile carriers.

Amazon, 2016. It’s Amazon AND Paypal’s first year getting into the Super Bowl commercial game, and Amazon isn’t taking it slow. Alec Baldwin and Dan Marino star in the footage, as well as this preview. “What about a snack stadium?”

Wix.com 2016. Brett Favre, Emmitt Smith, Terrell Owens, Larry Allen and Franco Harris trade in their football jerseys to be small business owners with the help of Wix.

 

Past Tech Company Super Bowl Ads:

Google, 2010. Google proves that they are still the number one search engine.

Microsoft, 2014. Microsoft breaking technology barriers to inspire others.

 

ETrade, 2013. Let’s not forget the introduction of the classic E*Trade baby.

 

In addition to these oldies and newcomers, Microsoft will be returning to the mix, along with a slew of other technology companies like Squarespace, Apartments.com (starring Jeff Goldblum) and gaming app Mobile Strike. Tax and payroll software company Intuit even ran a contest for a small business to win a 30-second spot (watch it here). It’s safe to say, technology companies are going to keep putting up the big bucks for Super Bowl commercials. Now, who wins for best tech company Super Bowl ad of 2016?

6 Apps to Help You Maintain Your Health & Fitness Goals

If you’re like the better half of America, last month you made the resolution to get fit and stay healthy. With January coming to an end and 2016 beginning to feel like old news, chances are you’ve conveniently forgotten or have given up completely on said resolutions. With the help of the following mobile apps fittingly compiled below, you don’t have to look any further than the palm of your hands to find the guidance you need to help stick to your health and fitness goals.

Want to work with mobile apps, not just workout with them? Check out these jobs.

  1. VitFitvitfit, $19.99/month (HQ in Philadelphia, PA) – VitFit aims to take the “work” out of your workout by helping you stay inspired and committed to your goals. If you don’t have the time, money, or confidence to head to the gym or use a personal trainer – but still want to get fit – VitFit may be the app you’re looking for. Based on your individual fitness goals, VitFit creates a personalized program and allows you to download an MP3 with your own trainer motivating you in real time. Cool fact: all workouts are created by certified personal trainers, so you’re sure to work up a sweat.
  2. Vea Fitness, Free (HQ in Philadelphia, PA) – Sometimes you need a little motivation to get off the couch and out for a run. Lucky for you, the folks behind VeaFitness agree! While it’s still in beta, when released you can complete runs to unlock rewards through the mobile app. Run 2 miles? Receive 20% off of your next purchase at Nike. Added bonus: Vea Fitness has its own built-in GPS tracking system and logs all of your runs, so no need for multiple tracking apps. Hit the pavement…then the mall.
  3. Fooducate, Free + in App Purchases (HQ in Bay Area, CA) – Fooducate takes theguesswork out of eating healthy. It doesn’t just track the quantity of calories you take in, but also the quality of your caloric intake. Navigate confusing product nutrition labels by scanning a barcode and receiving an easy to decipher A, B, C, or D letter grade. You’ll even get offered healthier alternatives.  If that’s not enough, Fooducate has its own community for feedback and support.foodcuate
  4. FitBliss Free (HQ in Bay Area, CA) – What better way to achieve your fitness goals
    than to promote some healthy competition? FitBliss brings fitness into the workplace with team competitions and challenges while promoting a happier, healthier work environment.
  5. yogaYogatailor, Free in app store and 15 day trial (HQ in Mountain View, CA) – Yogatailor is your custom yoga workout designed to tailor to your health needs. Do you want to sleep better? Do you want to get rid of that back pain? Just put your preferences in the app and let your custom yoga workout magically appear.
  6. DietSensor, $249 handheld molecule scanner + free app (HQ in Boston, MA) – DietSensor is a handheld scanner that can read the molecules in your donut and tell you how many calories are in that bad boy! The sensor sends information directly to an app on your phone. The mobile app not only tells you your pending calorie intake but also offers real-time coaching, a DietSensor community, and an optional scale. The only downside to this phenomenon? It only reads individual food items – so don’t try scanning your chimichanga.

DietSensor_fitnesstech

Want to see companies like this in person? Find a demo event at a city near you.

Your quest for a healthy life is a little more fun when you have a handy gadget or new technology to guide you. Whether it be a customizable fitness app or a calorie scanner, there is something technical out there to try this year. Maybe if you revisit your health and fitness goals with the aid of these helpful technologies, you’ll get the motivation you needed all along.

You may also be interested in: