[img]http://dl.iteye.com/upload/attachment/0065/9179/f33fe81d-9377-3436-b57d-64d2edd9189b.jpg[/img]
User interface design patterns are solutions to common design challenges, such as navigating around an app, listing data or providing feedback to users.
Mobile apps and sites have unique UI design requirements because, compared to their desktop counterparts, they’re used in smaller screens and, at least with today’s modern mobile devices, rely on fingers instead of a keyboard and mouse as input mechanisms.
Whether you’re designing a mobile app UI for the first time or in need of specific design solutions, these mobile UI design pattern resources will surely help!
[b]1. [url=http://mobile-patterns.com/]Mobile UI Patterns[/url][/b]
[img]http://dl.iteye.com/upload/attachment/0065/9181/4eae7c43-27ea-3fec-915b-478cafdd5697.jpg[/img]
Mobile UI Patterns is a great site to visit to see common mobile UI design patterns such as [url=http://mobile-patterns.com/activityfeeds]activity feeds[/url] and [url=http://mobile-patterns.com/notifications]notifications[/url]. The patterns are organized into 20 categories so that you can easily find what you’re looking for.
[b]2. [url=http://inspired-ui.com/]Inspired UI[/url][/b]
[img]http://dl.iteye.com/upload/attachment/0065/9183/426f711b-8ade-3514-bdf7-f05203610b94.jpg[/img]
Inspired UI is an excellent mobile UI design pattern gallery with over 1,000 screenshots of real mobile apps. Design patterns featured in the site include [url=http://inspired-ui.com/tagged/signup]sign up[/url] pages and [url=http://inspired-ui.com/tagged/check_in]check-in[/url] user interfaces.
[b]3. [url=http://www.lovelyui.com/]lovely ui[/url][/b]
[img]http://dl.iteye.com/upload/attachment/0065/9185/19257769-6294-3208-ab5a-30381e6a7cb6.jpg[/img]
This site features common mobile app user interface elements such as [url=http://www.lovelyui.com/tagged/buttons]buttons[/url], [url=http://www.lovelyui.com/tagged/list]lists [/url]and [url=http://www.lovelyui.com/tagged/popover]popovers[/url]. lovely ui was created by NYC-based interactive designer [url=http://www.dianadianadiana.com/]Diana Frurip[/url].
[b]4. [url=http://www.mobiledesignpatterngallery.com/mobile-patterns.php]Mobile Design Pattern Gallery[/url][/b]
[img]http://dl.iteye.com/upload/attachment/0065/9187/4fbad20a-9365-3e6d-9400-0ef7f8d594ed.jpg[/img]
This design pattern gallery is a supplement to UX designer Theresa Neil’s [url=http://www.amazon.com/Mobile-Design-Pattern-Gallery-Applications/dp/1449314325/?]mobile design pattern book[/url] published by O’Reilly Media. This gallery features an [url=http://mobiledesignpatterngallery.com/mobile-patterns.php?colid=65438029-72157627607687861]anti-patterns section[/url] featuring UI design techniques to avoid. You can also view the design patterns on [url=http://www.flickr.com/photos/mobiledesignpatterngallery/collections/]Flickr[/url].
[b]5. [url=http://pttrns.com/]pttrns[/url][/b]
[img]http://dl.iteye.com/upload/attachment/0065/9189/95c5269b-13de-3005-94ef-3a49bcfe7765.jpg[/img]
Over 30 mobile UI design patterns (e.g. [url=http://pttrns.com/splashscreens]splashscreens[/url] and [url=http://pttrns.com/walkthroughs]walkthroughs[/url]) are featured on pttrns, a gallery site with large screenshots and a clean interface. The site is by Robin Raszka (founder of popular iOS development firm [url=http://tapmates.com/]Tapmates[/url]) and [url=https://twitter.com/#!/chemix_cz]chemiX[/url].
[b]6. [url=http://www.patternsofdesign.co.uk/]Patterns of Design[/url][/b]
[img]http://dl.iteye.com/upload/attachment/0065/9191/7fcad1d5-1d5a-3851-8452-17b01ef6abbb.jpg[/img]
This site seeks to present notable mobile app UI patterns from exceptional iPhone and iPad apps. Patterns of Design is by Will Simons, a freelance UX designer and project manager.
[b]7. [url=http://4ourth.com/wiki/Index]4ourth Mobile Design Pattern Library[/url][/b]
[img]http://dl.iteye.com/upload/attachment/0065/9193/6b617d9b-07af-3769-8345-cc34682a5eea.jpg[/img]
This wiki resource is a general reference guide to mobile UI design patterns. It discusses a wide array of design patterns such as [url=http://4ourth.com/wiki/Slideshow]slideshows[/url] and [url=http://4ourth.com/wiki/Pagination]pagination[/url], to [url=http://4ourth.com/wiki/Advertising]advertising[/url] within your mobile app.
[b]8. [url=http://www.androiduipatterns.com/p/android-ui-pattern-collection.html]Android UI Design Patterns[/url][/b]
[img]http://dl.iteye.com/upload/attachment/0065/9195/a7a7c130-78b0-3ded-8155-faa7cedf0eec.jpg[/img]
This blog by German technologist/developer/Android user Juhani Lehtimaki publishes posts that cover Android UI design patterns. In each post, a design pattern is discussed and relevant screenshots from mobile apps are included.
[b]9. [url=http://androidpttrns.com/]android pttrns[/url][/b]
[img]http://dl.iteye.com/upload/attachment/0065/9197/d25f79c4-1a96-3529-83e2-14484f0e53b5.jpg[/img]
android pttrns, inspired by pttrns (featured above), is a gallery of Android app UI design patterns. It currently only has a few patterns, such as [url=http://androidpttrns.com/tagged/actionbar]action bar[/url] and [url=http://androidpttrns.com/tagged/tabbar]tab bar[/url].
[b]10. Official Developer Documentation of Mobile Operating Systems[/b]
Mobile OS manufacturers typically have official docs geared for professionals developing for their platform. These docs often include guides on UI design patterns.
[list]
[*]For [b]Android[/b], check out Android Design’s [url=http://developer.android.com/design/patterns/index.html]Pattern section[/url].
[*]For [b]iOS[/b] app designers, see [url=http://developer.apple.com/library/ios/#documentation/UserExperience/Conceptual/MobileHIG/Introduction/Introduction.html]iOS Human Interface Guidelines[/url] in the iOS Developer Library.
[*]Designing for [b]Nokia[/b] phones? Head over to [url=http://www.developer.nokia.com/Community/Wiki/Category:Mobile_Design_Patterns]Nokia Wiki’s Mobile Design Patterns[/url].
[/list]
【原文】[url=http://sixrevisions.com/user-interface/mobile-ui-design-patterns-inspiration/]http://sixrevisions.com/user-interface/mobile-ui-design-patterns-inspiration/[/url]
【中文】[url=http://www.lisadou.com/?p=206]http://www.lisadou.com/?p=206[/url]
User interface design patterns are solutions to common design challenges, such as navigating around an app, listing data or providing feedback to users.
Mobile apps and sites have unique UI design requirements because, compared to their desktop counterparts, they’re used in smaller screens and, at least with today’s modern mobile devices, rely on fingers instead of a keyboard and mouse as input mechanisms.
Whether you’re designing a mobile app UI for the first time or in need of specific design solutions, these mobile UI design pattern resources will surely help!
[b]1. [url=http://mobile-patterns.com/]Mobile UI Patterns[/url][/b]
[img]http://dl.iteye.com/upload/attachment/0065/9181/4eae7c43-27ea-3fec-915b-478cafdd5697.jpg[/img]
Mobile UI Patterns is a great site to visit to see common mobile UI design patterns such as [url=http://mobile-patterns.com/activityfeeds]activity feeds[/url] and [url=http://mobile-patterns.com/notifications]notifications[/url]. The patterns are organized into 20 categories so that you can easily find what you’re looking for.
[b]2. [url=http://inspired-ui.com/]Inspired UI[/url][/b]
[img]http://dl.iteye.com/upload/attachment/0065/9183/426f711b-8ade-3514-bdf7-f05203610b94.jpg[/img]
Inspired UI is an excellent mobile UI design pattern gallery with over 1,000 screenshots of real mobile apps. Design patterns featured in the site include [url=http://inspired-ui.com/tagged/signup]sign up[/url] pages and [url=http://inspired-ui.com/tagged/check_in]check-in[/url] user interfaces.
[b]3. [url=http://www.lovelyui.com/]lovely ui[/url][/b]
[img]http://dl.iteye.com/upload/attachment/0065/9185/19257769-6294-3208-ab5a-30381e6a7cb6.jpg[/img]
This site features common mobile app user interface elements such as [url=http://www.lovelyui.com/tagged/buttons]buttons[/url], [url=http://www.lovelyui.com/tagged/list]lists [/url]and [url=http://www.lovelyui.com/tagged/popover]popovers[/url]. lovely ui was created by NYC-based interactive designer [url=http://www.dianadianadiana.com/]Diana Frurip[/url].
[b]4. [url=http://www.mobiledesignpatterngallery.com/mobile-patterns.php]Mobile Design Pattern Gallery[/url][/b]
[img]http://dl.iteye.com/upload/attachment/0065/9187/4fbad20a-9365-3e6d-9400-0ef7f8d594ed.jpg[/img]
This design pattern gallery is a supplement to UX designer Theresa Neil’s [url=http://www.amazon.com/Mobile-Design-Pattern-Gallery-Applications/dp/1449314325/?]mobile design pattern book[/url] published by O’Reilly Media. This gallery features an [url=http://mobiledesignpatterngallery.com/mobile-patterns.php?colid=65438029-72157627607687861]anti-patterns section[/url] featuring UI design techniques to avoid. You can also view the design patterns on [url=http://www.flickr.com/photos/mobiledesignpatterngallery/collections/]Flickr[/url].
[b]5. [url=http://pttrns.com/]pttrns[/url][/b]
[img]http://dl.iteye.com/upload/attachment/0065/9189/95c5269b-13de-3005-94ef-3a49bcfe7765.jpg[/img]
Over 30 mobile UI design patterns (e.g. [url=http://pttrns.com/splashscreens]splashscreens[/url] and [url=http://pttrns.com/walkthroughs]walkthroughs[/url]) are featured on pttrns, a gallery site with large screenshots and a clean interface. The site is by Robin Raszka (founder of popular iOS development firm [url=http://tapmates.com/]Tapmates[/url]) and [url=https://twitter.com/#!/chemix_cz]chemiX[/url].
[b]6. [url=http://www.patternsofdesign.co.uk/]Patterns of Design[/url][/b]
[img]http://dl.iteye.com/upload/attachment/0065/9191/7fcad1d5-1d5a-3851-8452-17b01ef6abbb.jpg[/img]
This site seeks to present notable mobile app UI patterns from exceptional iPhone and iPad apps. Patterns of Design is by Will Simons, a freelance UX designer and project manager.
[b]7. [url=http://4ourth.com/wiki/Index]4ourth Mobile Design Pattern Library[/url][/b]
[img]http://dl.iteye.com/upload/attachment/0065/9193/6b617d9b-07af-3769-8345-cc34682a5eea.jpg[/img]
This wiki resource is a general reference guide to mobile UI design patterns. It discusses a wide array of design patterns such as [url=http://4ourth.com/wiki/Slideshow]slideshows[/url] and [url=http://4ourth.com/wiki/Pagination]pagination[/url], to [url=http://4ourth.com/wiki/Advertising]advertising[/url] within your mobile app.
[b]8. [url=http://www.androiduipatterns.com/p/android-ui-pattern-collection.html]Android UI Design Patterns[/url][/b]
[img]http://dl.iteye.com/upload/attachment/0065/9195/a7a7c130-78b0-3ded-8155-faa7cedf0eec.jpg[/img]
This blog by German technologist/developer/Android user Juhani Lehtimaki publishes posts that cover Android UI design patterns. In each post, a design pattern is discussed and relevant screenshots from mobile apps are included.
[b]9. [url=http://androidpttrns.com/]android pttrns[/url][/b]
[img]http://dl.iteye.com/upload/attachment/0065/9197/d25f79c4-1a96-3529-83e2-14484f0e53b5.jpg[/img]
android pttrns, inspired by pttrns (featured above), is a gallery of Android app UI design patterns. It currently only has a few patterns, such as [url=http://androidpttrns.com/tagged/actionbar]action bar[/url] and [url=http://androidpttrns.com/tagged/tabbar]tab bar[/url].
[b]10. Official Developer Documentation of Mobile Operating Systems[/b]
Mobile OS manufacturers typically have official docs geared for professionals developing for their platform. These docs often include guides on UI design patterns.
[list]
[*]For [b]Android[/b], check out Android Design’s [url=http://developer.android.com/design/patterns/index.html]Pattern section[/url].
[*]For [b]iOS[/b] app designers, see [url=http://developer.apple.com/library/ios/#documentation/UserExperience/Conceptual/MobileHIG/Introduction/Introduction.html]iOS Human Interface Guidelines[/url] in the iOS Developer Library.
[*]Designing for [b]Nokia[/b] phones? Head over to [url=http://www.developer.nokia.com/Community/Wiki/Category:Mobile_Design_Patterns]Nokia Wiki’s Mobile Design Patterns[/url].
[/list]
【原文】[url=http://sixrevisions.com/user-interface/mobile-ui-design-patterns-inspiration/]http://sixrevisions.com/user-interface/mobile-ui-design-patterns-inspiration/[/url]
【中文】[url=http://www.lisadou.com/?p=206]http://www.lisadou.com/?p=206[/url]
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
