Webinar Recap

Mobile first: A future-friendly approach to UX design

by

on

View all posts

Asher Blumberg, Mobile UX Designer at StumbleUpon, hosted a webinar with us last week about why mobile-first thinking isn’t just about devices. Thinking mobile is about better usability, optimizing for screen real estate, and simplifying your design elements and layouts.

Check out the video below for the full recording, and read on for our short recap.


A history of interfaces

1961: The Rand Corporation invented the first computer interface
1984: The Apple Macintosh computer debuted for a mass audience
2007: The iPhone—though not the first touchscreen—was the most significant
2009: The Kinect showed a new way to connect technology with the body
2011: We met Siri, the “no-interface interface”
2011: We welcomed Nest into our homes
2013: Oculus Rift, the VR technology, allows people to immerse themselves in other realities
2015: The Apple Watch shows that wearables can allow you to be less distracted by physical devices by not being tied into an interface
2015: Amazon Echo launched out of beta and is currently the most powerful voice-powered device on the market

Innovation is exploding in every direction. With all of these “smart” things—smart cars, smart phones, smart watches, smart glasses—it’s a designer’s job to figure out the best way to deliver content in such a vastly connected world.

“The projects you’re working on at this very moment will be interacted with on devices that didn’t exist when you created them.”

While we don’t know what future technologies will look like, we do know that future-friendly strategies will allow our designs to work and look the best on devices that haven’t even been invented yet. The projects you’re working on at this very moment will be interacted with on devices that didn’t exist when you created them.

Reconciling iOS and Android paradigms

su-invision-webinar-asher-blumberg-06

Asher’s specialty is creating native mobile apps that bridge the gap between Apple and Google devices. Both iOS and Android’s design guidelines share commonalities worth exploring.

While working on StumbleUpon’s iOS and Android redesigns, Asher and his design team focused on balancing the app’s unique characteristics and the core conventions of these 2 dominant mobile platforms.

Design guidelines

su-invision-webinar-asher-blumberg-03

Asher laid out a few of his own design guidelines to create a cohesive iOS and Android experience, while making it unique enough that users realize they’re in a distinctly branded app.

Iconography
Pour over both guidelines, especially the iOS Human Interface & Material Guidelines. You might choose to style icons for their respective platforms, sticking to thin-stroked, hollow icons on iOS and going bolder on Android. Alternatively, you can create custom icons that can live across both iOS and Android.

Colors
Stick with colors specified in your branding guide. This will help with consistency in the future when working across platforms.

Above and beyond the guidelines
Be intentional and back it up with good reasoning when you take liberties with the guidelines. Adapt your designs to varying contexts and blend different styles to create an authentic and meaningful UI.

Some final pro tips

  • Use good naming conventions
  • When exporting assets for development, stick to layer names that match your naming conventions
  • Use text styles for headlines and other repeating text types. Create symbols for repeating patterns or UI elements.
  • Take advantage of artboards for a multi-screen view so you can quickly see your flows and product depth. Doing this will help you stay focused on the big picture.

We love how Matt summed it up:

P.S. Interested in Enterprise UX design? Sign up for our next InVision Webinar.


more-talks
Author

Margaret Kelsey
Content + community at InVision. Newly Bostonian.

Keep up with me on and .

Join over 2 million designers

Who get our content first.

No sales pitches, no games, and one-click unsubscribe.

Over 2 million designers
get our newsletter
every week

Find out why

Get awesome design content in your inbox every week

Just like over 2 million of your fellow designers do.

Plus get 3 free downloads, just for signing up.

Give it a try—it only takes a click to unsubscribe.

Thanks for signing up!

You should have a thank you gift in your inbox now—and you'll hear from us again soon!

Prototype better experiences with InVision

Just like over 2 million of your fellow designers do.

I agree to InVision's Terms of Service.

Want a free t-shirt?

Join the 2 million+ designers who get our newsletter weekly for your chance to win!

We hate spam as much as you do, and you can unsubscribe anytime.

Double your chances to win!

Tweet and automatically get a second entry

Tweet Now

No Thanks

Stay in touch!

We share news, freebies, and more on Twitter.