前言
实验准备
-
选取一个界面原型的工具，熟悉其操作界面
-
pencil：https://pencil.evolus.vn/
实验内容
- 采用“以用户为中心”、迭代式的方法进行设计；用原型工具快速画出草图（查看界面www.xmu.edu.cn）
环境
-
pencil：https://pencil.evolus.vn/
-
其他的工具：
http://next.36kr.com/posts/collections/1
下载墨刀
- 下载地址： https://modao.cc/
具体流程
原型界面
-
我们以厦门大学首页为例，讲解原型界面设计。
厦大原型.png
操作步骤
1. 创建项目
我们选择创建web项目，填写名称，可以上传图标，最后点击创建。
创建项目.png
2.操作界面
墨刀界面.png
3.以厦门大学首页为原型制作界面
- 我们从上到下制作：
1.插入厦大图标，输入厦门大学以及XIAMEN UNIVERSITY的文字
插入图片.png
2.输入厦门大学以及XIAMEN UNIVERSITY的文字
插入文字.png
3.插入蓝色背景
插入背景.png
前三步骤效果如下图
效果1.png
4.制作导航栏并加入链接
-
首先按照第二步插入文本
-接着制作链接
链接.png
5.制作轮播图
轮播图制作.png
6.插入图标
插入图标.png
通过上述六个基本操作，就可以制作出来厦门大学首页啦
大家可以自己研究其他一些组件以及图标的运用等等，制作出更加精美的界面啦！
网友评论