# 界面设计 **Repository Path**: sanee/interface_design ## Basic Information - **Project Name**: 界面设计 - **Description**: No description available - **Primary Language**: Unknown - **License**: Not specified - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2020-05-05 - **Last Updated**: 2020-12-19 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README ## 视觉界面设计期中作业 #### 小组成员（周一12-13节）： * 181013059许钰然 * 181013037冯静雯 * 181013083黄梓珊 #### 我们所选择的竞品为*青柠手账*，以下为我们的竞品分析。 #### 1.架构层 * 主导航的信息架构简要列明： ![竞品主导航](https://images.gitee.com/uploads/images/2020/0506/182024_13fb06cd_2228445.png "屏幕截图.png") * 细分页面的结构框架： ![竞品细分](https://images.gitee.com/uploads/images/2020/0506/182308_fb158e86_2228445.png "屏幕截图.png") --- #### 2.交互路径分析 ![竞品路径1](https://images.gitee.com/uploads/images/2020/0506/182543_c56109e9_2228445.png "屏幕截图.png") ![竞品路径2](https://images.gitee.com/uploads/images/2020/0506/182604_b08a11a0_2228445.png "屏幕截图.png") * 3家竞品亮点分析 ![青柠](https://images.gitee.com/uploads/images/2020/0506/182737_4aab1c7c_2228445.png "屏幕截图.png") ![color](https://images.gitee.com/uploads/images/2020/0506/182749_43b726ee_2228445.png "屏幕截图.png") ![时光](https://images.gitee.com/uploads/images/2020/0506/182803_974b40d5_2228445.png "屏幕截图.png") --- #### 3.视觉层面分析 ![颜色规范](https://images.gitee.com/uploads/images/2020/0506/181633_4bf2dbfa_2228445.png "屏幕截图.png") ![内容板式](https://images.gitee.com/uploads/images/2020/0506/181835_442d119e_2228445.png "屏幕截图.png") --- ### 我们的产品：*BE手账* #### 产品logo概述： BE手账logo采用 *橙黄色* 色调为主，塑造有活力、温暖、青春的形象。 选择BE以及蜜蜂图标作为logo内容的原因： * BE手账，be yourself=在这里做真实的自己，表达自己真情实感。 * It can be everything you want=根据你的想法/需求，BE手账帮助你制作独一无二的手账。 * BE发音与bee发音相似，我们选定了蜜蜂作为我们产品的形象。蜜蜂活泼，勤劳。采撷蜂蜜、酝酿幸福，就好比用户不时地记录下身边的美好事物做成手账，汇编成自己的幸福回忆。 #### 1.架构层 ![产品架构](https://images.gitee.com/uploads/images/2020/0509/002252_d8ba34e2_2228445.png "屏幕截图.png") --- #### 2.交互路径分析 BE手账页面设计特点：相近性（留白），相似性（颜色，大小，形状相似的为一组），连续性（可滑动的手账） ![登录界面](https://images.gitee.com/uploads/images/2020/0509/002338_a6bbf42f_2228445.png "屏幕截图.png") ![创建手账](https://images.gitee.com/uploads/images/2020/0509/002415_574395ee_2228445.png "屏幕截图.png") ![素材收集](https://images.gitee.com/uploads/images/2020/0509/002444_4face6a1_2228445.png "屏幕截图.png") ![个人信息](https://images.gitee.com/uploads/images/2020/0509/002630_b42e80f3_2228445.png "屏幕截图.png") ![社交功能](https://images.gitee.com/uploads/images/2020/0509/002708_b0603327_2228445.png "屏幕截图.png") --- #### 页面设计总结： 我们在界面设计中运用了格式塔规律：相近性，同一模块的内容比较紧凑，视觉上形成一组；连续性，在界面中采取，引起用户对新内容的兴趣；对称性，整体对称，有序整洁，自然。 --- #### 3.视觉层面分析 ![图标](https://images.gitee.com/uploads/images/2020/0509/132525_4f18bfcd_2228445.png "屏幕截图.png") 图标结合线和面类型，组成可接触的/可改变状态的 ![颜色](https://images.gitee.com/uploads/images/2020/0511/193527_8f59d496_2228445.png "屏幕截图.png") ![内容板块](https://images.gitee.com/uploads/images/2020/0509/132600_4a52eb9d_2228445.png "屏幕截图.png")