So You Want Your Hybrid Mobile App to Feel Native…

Brandon Landis
Mar 7, 2017 · 9 min read

Rule #1) Use native transitions & animations

Rule #2) Use caching to preserve online content when the app is re-opened

Rule #3) Refer to Android and iOS’ guidelines for design and UI; these can be mimicked on various hybrid platforms

Rule #4) When you do have to code, try to keep your components in minimal HTML/CSS, rather than using JavaScript, which can hurt app loading times

Rule #5) If you only pay attention to making one component of your app look truly native…

Rule #6) Use the OS’ correct font

/* iOS */
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;

/* Android */
font-family: 'RobotoRegular', 'Droid Sans', sans-serif;

/* Windows Phone */
font-family: 'Segoe UI', Segoe, Tahoma, Geneva, sans-serif;

Rule # 7) Choose icons and buttons over text and text links

Rule #8) Optimize speed

Rule #9) Account for different screen rotations

A screenshot from the responsive designer tool in Aquro Platform.

Rule #10) Don’t give gestures the finger

GIF animation courtesy of iphonehacks.com

Rule #11) Don’t just port your stupid website into a stupid app

Rule #12) Choose the right tools

The Takeaway:


Appademics Magazine

Online publication dedicated to content for app developers. Tutorials, opinion pieces, and more! AppademicsMagazine@gmail.com

Brandon Landis

Written by

Editor for Appademics Magazine — the publication for current & aspiring app developers!

Appademics Magazine

Online publication dedicated to content for app developers. Tutorials, opinion pieces, and more! AppademicsMagazine@gmail.com