分享

想要提升你的设计B格,请先学会画这些UI/UX线框草图

 大隆龙 2017-09-10

现在越来越多ui设计师都需要画一些交互的线框图,如果掌握好这些技巧,可以让你的B格提升一大节,今天为大家整理了一大波UI/UX的原型图,有手绘的、有用软件绘制的,分别来源于不同的设计师、交互设计师、产品经理之手,虽只是草图,但小编看后,已经有灵感了哦!来一起看看他们的杰作。

下面来一起看看这些个优秀UI/UX线框图

1. 草图是Q版的,还加入了一些颜色,让草图生动起来。其次这是迷你草图,文字直接用「粗签字笔」来表示,能快速的记录临时的灵感想法。

想要提升你的设计B格,请先学会画这些UI/UX线框草图

2. 正规一点的草图,直接用电脑软件绘制

想要提升你的设计B格,请先学会画这些UI/UX线框草图

3 配色参考

想要提升你的设计B格,请先学会画这些UI/UX线框草图

4 头脑风暴

想要提升你的设计B格,请先学会画这些UI/UX线框草图

5 灰度

想要提升你的设计B格,请先学会画这些UI/UX线框草图

6.快速记录想法的草图

想要提升你的设计B格,请先学会画这些UI/UX线框草图

7.用软件制作的原型图

想要提升你的设计B格,请先学会画这些UI/UX线框草图

8. 这个流程图好看

想要提升你的设计B格,请先学会画这些UI/UX线框草图

9.也是快速整理结构想法的

想要提升你的设计B格,请先学会画这些UI/UX线框草图

10. 原型就该用这些浅灰的配色

想要提升你的设计B格,请先学会画这些UI/UX线框草图

11. Wow…这想法还是真丰富

想要提升你的设计B格,请先学会画这些UI/UX线框草图

12. 还有阴影也画了

想要提升你的设计B格,请先学会画这些UI/UX线框草图

13. 草图质量做到这样就很棒了

想要提升你的设计B格,请先学会画这些UI/UX线框草图

14

想要提升你的设计B格,请先学会画这些UI/UX线框草图

15

想要提升你的设计B格,请先学会画这些UI/UX线框草图

16

想要提升你的设计B格,请先学会画这些UI/UX线框草图

17

想要提升你的设计B格,请先学会画这些UI/UX线框草图

18. 全黑不好看,加点颜色~

想要提升你的设计B格,请先学会画这些UI/UX线框草图

19. 打印出来,标记重点为

想要提升你的设计B格,请先学会画这些UI/UX线框草图

20. Cool! 这个主意太好了,我之前为什么没想到呢,原来有颜色的地方表示链接(可点击),然后画引导线的时候就不需要从链接点开始画,这样简洁很多。

想要提升你的设计B格,请先学会画这些UI/UX线框草图

21. 你看到的连线,使用的软件是 Adobe XD,根据设计达人网小编体验,感觉还是 Sketch 来做ui设计好一些,希望它快点出Windows版吧……

想要提升你的设计B格,请先学会画这些UI/UX线框草图

22. UI设计专用的点点本?

想要提升你的设计B格,请先学会画这些UI/UX线框草图

23. 网页原型

想要提升你的设计B格,请先学会画这些UI/UX线框草图

24. 一个迷你版原型图,好Q~

想要提升你的设计B格,请先学会画这些UI/UX线框草图

25. UI比例控制很好,很整齐

想要提升你的设计B格,请先学会画这些UI/UX线框草图

26. 临时想法

想要提升你的设计B格,请先学会画这些UI/UX线框草图

27.

想要提升你的设计B格,请先学会画这些UI/UX线框草图

28. 产品经理,还是用更快、更简单的原型设计工具Mockplus吧

想要提升你的设计B格,请先学会画这些UI/UX线框草图

29

想要提升你的设计B格,请先学会画这些UI/UX线框草图

原型草图,大多是记录临时的想法,当进一步确定后,就会去使用软件画正规一点的原型或者直接出UI设计稿。今天分享到这里,下次画线框图时不妨先看看这篇文章,里面的草图、笔记本、颜色笔、原型工具都是不错的。

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多