Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups
-
Upload
andrew-lee -
Category
Mobile
-
view
474 -
download
0
Transcript of Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups
![Page 1: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/1.jpg)
STARTUP UI TRENDSDECEMBER, 2016 • VOL. 1
CREATED BY
![Page 2: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/2.jpg)
UI DESIGN TRENDS • VOL 1
OPERATOR (OPERATOR.COM)
CREATED BY
![Page 3: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/3.jpg)
UI DESIGN TRENDS • VOL 1
▸ Simplified color palette
▸ Use of white space and drop shadows
▸ No big navigation bar in hero
OPERATOR (OPERATOR.COM)
CREATED BY
![Page 4: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/4.jpg)
OPERATOR (OPERATOR.COM)
UI DESIGN TRENDS • VOL 1 CREATED BY
![Page 5: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/5.jpg)
OPERATOR (OPERATOR.COM)
UI DESIGN TRENDS • VOL 1
▸ Use of bright gradient colors
▸ Light fonts
▸ Nav bar appears after scroll
CREATED BY
![Page 6: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/6.jpg)
UI DESIGN TRENDS • VOL 1
ANDO (IOS)
CREATED BY
![Page 7: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/7.jpg)
UI DESIGN TRENDS • VOL 1
ANDO (IOS)
▸ Android-like menu
▸ Down arrow on top of gradient
CREATED BY
![Page 8: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/8.jpg)
UI DESIGN TRENDS • VOL 1
ANDO (IOS)
CREATED BY
![Page 9: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/9.jpg)
UI DESIGN TRENDS • VOL 1
ANDO (IOS)
▸ Clean custom buttons
▸ Unique alerts
CREATED BY
![Page 10: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/10.jpg)
STRIPE (STRIPE.COM)
UI DESIGN TRENDS • VOL 1 CREATED BY
![Page 11: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/11.jpg)
STRIPE (STRIPE.COM)
UI DESIGN TRENDS • VOL 1
▸ Rounded edge buttons
▸ Simple flat icon art
▸ No obvious nav bar in hero
▸ Bright gradients
CREATED BY
![Page 12: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/12.jpg)
CREATED BY
TINYCARDS (TINYCARDS.DUOLINGO.COM)
UI DESIGN TRENDS • VOL 1
![Page 13: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/13.jpg)
CREATED BY
TINYCARDS (TINYCARDS.DUOLINGO.COM)
UI DESIGN TRENDS • VOL 1
▸ Bright gradient hero
▸ Lines to break up site sections
▸ Dropshadows
![Page 14: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/14.jpg)
CREATED BY
TINYCARDS (IOS)
UI DESIGN TRENDS • VOL 1
![Page 15: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/15.jpg)
CREATED BY
TINYCARDS (IOS)
UI DESIGN TRENDS • VOL 1
▸ Clean custom search input
▸ Thick all caps fonts for headings
▸ Simple rounded edge buttons
![Page 16: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/16.jpg)
CREATED BY
TINYCARDS (IOS)
UI DESIGN TRENDS • VOL 1
![Page 17: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/17.jpg)
CREATED BY
TINYCARDS (IOS)
UI DESIGN TRENDS • VOL 1
▸ Easy to use text input page
▸ Unique and clean settings page
▸ Unique and clean settings page
![Page 18: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/18.jpg)
CREATED BY
OPERATOR (IOS)
UI DESIGN TRENDS • VOL 1
![Page 19: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/19.jpg)
CREATED BY
OPERATOR (IOS)
UI DESIGN TRENDS • VOL 1
▸ Unique registration page
▸ Clean white space
![Page 20: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/20.jpg)
CREATED BY
OPERATOR (IOS)
UI DESIGN TRENDS • VOL 1
![Page 21: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/21.jpg)
CREATED BY
OPERATOR (IOS)
UI DESIGN TRENDS • VOL 1
▸ Unique popup confirmations
▸ Line art icons ▸ Rounded edge pop-up
![Page 22: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/22.jpg)
CREATED BY
JETSMARTER (IOS)
UI DESIGN TRENDS • VOL 1
![Page 23: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/23.jpg)
CREATED BY
JETSMARTER (IOS)
UI DESIGN TRENDS • VOL 1
▸ Flat interface and flat colors
▸ Simple rounded button
▸ Flat line icons
![Page 24: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/24.jpg)
CREATED BY
SQUARE CASH (IOS)
UI DESIGN TRENDS • VOL 1
![Page 25: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/25.jpg)
UI DESIGN TRENDS • VOL 1 CREATED BY
SQUARE CASH (IOS)
▸ Simple color palette
▸ Simple rounded buttons
▸ Use of different sizes to guide hierarchy
![Page 26: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/26.jpg)
CONCLUSION
▸ Customizing all functions inside mobile apps outside of the typical native GUI give the app an extra polished feel
▸ Bright colors and typically simple color palettes with just 1 bright color and grays
▸ Use of white space to easily guide eye through web or app design hierarchy
▸ Android-like nav menu seen in iOS
▸ Simple line or flat icons
COMMON UI CHARACTERISTICS THIS MONTH
CREATED BY
![Page 27: Startup UI Trends, Dec 2016 Vol. 1 - Common UI Trends Seen in Startups](https://reader031.fdocuments.in/reader031/viewer/2022030317/586f71a41a28ab10258b506f/html5/thumbnails/27.jpg)
THANK YOU FOR VIEWING. FOLLOW US AT @DOCTALKAPP FOR MORE
JOIN OUR MAILING LIST FOR MONTHLY UI TRENDS AT WWW.DOCTA.LK