12Grid 智能手机APP栅格系统(原创)
12Grid是全球首款兼容多分辨率机型的智能手机应用界面删格布局系统,
使用该套栅格系统,设计师无需再计算尺寸,按照栅格自由布局即可,将大大加快手机应用设计的布局效率,将焦点集中在细节的设计和图形界面的创意
使用栅格系统,可快速布局成四列图标、三列图标、两列缩略图等基本常规的布局、以及更加自由的布局(如WinPhone的磁贴)、甚至手机游戏的界面布局等
一套设计,兼容640X960(1136)的iphone设备,480X800(845)等主流的Android设备,320X480的WebAPP(手机网站)
[flash=500,400]http://s1.knowsky.com/20131005/adgr1yrbnl3261642415.jpg[/flash]
注意:栅格系统只是一种布局辅助工具,可灵活根据实际项目需要在整体或局部合理应用,不宜过于依赖,限制创意思维。
基本布局案例:Basic Layout Example
[flash=500,400]http://s1.knowsky.com/20131005/5a5bjt4bjaq261642615.jpg[/flash]
[flash=500,400]http://s1.knowsky.com/20131005/jb2mqutheem291644215.jpg[/flash]
[flash=500,400]http://s1.knowsky.com/20131005/gp303cre3mo301644415.jpg[/flash]
[flash=500,400]http://s1.knowsky.com/20131005/wqf2lvk5jva301644715.jpg[/flash]
[flash=500,400]http://s1.knowsky.com/20131005/1chngntzmit301644815.jpg[/flash]
[flash=500,400]http://s1.knowsky.com/20131005/hen4kr2yax0311644915.jpg[/flash]
自由布局案例:Free layout Example
[flash=500,400]http://s1.knowsky.com/20131005/facu3231wnk311645115.jpg[/flash]
[flash=500,400]http://s1.knowsky.com/20131005/o0gspsnfefu311645315.jpg[/flash]
[flash=500,400]http://s1.knowsky.com/20131005/h2j3zhagn5a311645415.jpg[/flash]
[flash=500,400]http://s1.knowsky.com/20131005/stfbqq5v03u311645515.jpg[/flash]
[flash=500,400]http://s1.knowsky.com/20131005/3g4mcjr4m5f321645715.jpg[/flash]
[flash=500,400]http://s1.knowsky.com/20131005/pb1vkat2kvw321645815.jpg[/flash]
游戏布局案例:Mobile games Example
[flash=500,400]http://s1.knowsky.com/20131005/aq14k0yxh4i321646015.jpg[/flash]
[flash=500,400]http://s1.knowsky.com/20131005/tdqliexwy5p321646315.jpg[/flash]
[flash=500,400]http://s1.knowsky.com/20131005/nre1bzrwu1f331646415.jpg[/flash]
[flash=500,400]http://s1.knowsky.com/20131005/sxbthlrcj0a331646615.jpg[/flash]
如何使用:
请下载ZIP附件,内含各个模式下的PSD模板,只需根据项目或产品的需要,选择相应尺寸的PSD文件,用CS5.0以上版本photoshop打开即可。
另支持PS参考线插件“GuideGuide”插件的用法请去官网(http://guideguide.me/)了解。点击GuideGuide面板右上角,下拉菜单中选择“Import sets”并选择附件中“12Grid.json”导入,然后切换到“Sets”点选需要的参考线,点击下部“GG”按钮即创建参考线。
该栅格系统完全开源,可商业应用,欢迎各界技术牛人编写技术框架,我将集中推荐,并供免费下载使用。
适用于Pad的栅格系统即将发布,敬请关注
http://www.weibo.com/imtanlee
http://www.behance.net/tanlee
http://tanlee.zcool.com.cn/
若有好心人贡献个Dribbble邀请,相必真真也是极好的……