Grid Diary是一款非常受文艺青年喜爱的记录应用,它设计简单,内容却非常丰富。它不再是单调的文字记录,界面的设计非常与众不同,由许多格子拼凑而成,每一个格子里面还带有一个问题,十分有趣。提到格子,不得不说Mockplus最近推出的全新表格组件,真正实现了所见即所得,它不再是文字输入+算法转化的方式,而是可以直接添加表格行列,在对应表格中双击即可实现文字输入。在设计这种带表格的界面时,简单且快速。由于制作这款原型时,表格组件还未推出,因此是用线条来拼凑的,稍显吃力。之后一起来试试这个全新的表格组件吧。

先简单看看动图:

点击这里,可以立即在线预览:https://run.mockplus.cn/O3k9F3hCLCIwZ6Ki/index.html

再送上UI Flow大图:

这个原型的主要页面有:欢迎页面、引导页面、主页、编辑页面、详情页面、分享页面等。

以上设计的所有页面可以在这里下载分享

所有页面的图片集(10张),在这里下载

Enjoy it!

【附源文件】日记类App原型制作分享-Grid Diary的更多相关文章

  1. 天气类App原型制作分享-ColorfulClouds

    ColorfulClouds是一款界面精美的天气预报App,它可以准确预报降雨量.污染程度等.这款App最美的是它的首页天气插画,扁平精美,同时配上了适当的动效,把普通的天气变得漂亮有趣,十分吸引眼球 ...

  2. 健康类App原型制作分享-Mindmate

    Mindmate是一款健康类App,主要是帮助人们快速入眠,放松情绪,它拥有小清新的界面,配图全是由插画组成,生动有趣.在这款原型中,为了保持App的原有特色,将插画通过图片组件导入进来:音乐播放界面 ...

  3. 生活类App原型制作分享-AnyList

    AnyList是一款可以帮你创建购物清单,并且帮助你整理食谱的生活工具App,前面引导页采用图片+文字的方式,介绍App的用法,登录注册采用选项卡切换的方式,减少了页面切换的繁琐操作,在Mockplu ...

  4. 体育类App原型制作分享-Onefootball

    Onefootball 是一款适合于足球迷的应用,提供全球 100 多项赛事的新闻.数据.比分和直播.原型中选择“喜欢的球队”这个界面中,用到了悬浮按钮,采用的是滚动区来放置需要滚动的球队列表,然后将 ...

  5. 效率类APP原型制作分享----Timeglass

    本原型由国产Mockplus(原型工具)和iDoc(智能标注,一键切图工具)提供. 主要页面:启动页面.主页.添加事件页面.设置页面等. mp文件下载:点击这里 在线预览:http://run.moc ...

  6. 【附源文件】软件工具类Web原型制作分享 - Sketch

    Sketch是一款轻量,易用的矢量设计工具.专门为UI设计师开发,让UI设计更简单.更高效. 本原型由国产原型工具-Mockplus制作完成. 非常适合工具类产品官网使用,本模板的交互有通过使用面板组 ...

  7. 电商类web原型制作分享——美丽说【附源文件】

    美丽说是国内白领女性时尚消费品牌,精选上千家优质卖家供应商,为用户提供女装.女鞋.女包.配饰.美妆等品类的优质时尚商品. 此原型模板所用到的组件有搜索框.下拉菜单.输入框.选项卡等.交互动作有切换选项 ...

  8. 最近在研究电台类app,分享2个源码大家一起讨论

    好像去年有一阵,电台类的app特别火爆,喜马拉雅和蜻蜓FM互相还撕逼.听老罗,听好好说话,都得在电台app里,所以我想研究研究这些app.我没那么多资源,只好从app的开发架构方面去研究. 我看api ...

  9. 美食类Web原型制作分享-Taste

    Taste是国外知名的美食类网站,为人们提供丰富的美食菜单,帮助人们更好的享受美食带来的快乐.网站采用图文结合的排版方式,有固定顶部导航栏的交互功能等. 本原型由国产原型工具Mockplus和团队协作 ...

随机推荐

  1. 使用Python调用动态库

    我个人在日常使用电脑时,经常需要使用Google,于是就要切换代理,基本上是一会儿切换为代理,一会儿切换成直连,老是打开internet 选项去设置,很不方便,于是我萌生了一个想法: 做一个开关,我想 ...

  2. oracle跟踪sql语句

    oracle跟踪sql语句 select * from v$sql 查询客户端电脑名称的ID select terminal, SID,SERIAL#  from v$session where  ( ...

  3. xcode显示行号show gutter

    要在每一个代码编辑窗口中的边线里显示行号: 使用Xcode > Preferences 菜单命令,点击 Text Editing,然后选择Editing 然后点击选择 “Line numbers ...

  4. python, Django csrf token的问题

    环境 Window 7 Python2.7 Django1.4.1 sqlite3 问题 在使用Django搭建好测试环境后,写了一个提交POST表单提交留言的测试页面. 如图: 填写表单,点击“提交 ...

  5. js中对话框的使用

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  6. fm 讲解加代码

    转自: 博客 http://blog.csdn.net/google19890102/article/details/45532745/ github https://github.com/zhaoz ...

  7. Mysql 多个字段查找重复数

    delete FROM `test_table` WHERE id in (SELECT id,concat(user_id,user_id2) as __fFROM `test_table` whe ...

  8. sass使用指南

    [sass使用指南] http://www.ruanyifeng.com/blog/2012/06/sass.html

  9. LuoguP1032 字符变换(BFS)

    题目链接为:https://www.luogu.org/problemnew/show/P1032 思路:看到数据比较小,而且最多有6个规则,就可以用搜索去做了,我用的BFS,大体思路如下: 定义结构 ...

  10. 自对齐(self-aligned)

    C语言是自对齐的,32位以4字节对齐,64位以8字节对齐(1字节=8 bits) 自对齐的好处:在一条指令内完成数据的取或者存的操作,使得内存访问更快:否则,如果一个变量跨机器字存储,那么要做两次或更 ...