如图这是老师布置的一次作业,作业由四人一个小组统一一个主题进行设计页面,每个人都设计不同的页面。我这一小组的主题是广发借贷,而上图是我所设计的一个广发借贷的页面。
这个页面的设计灵感来源于网上一位网友发表自己的作品:
正好我在查找素材的时候看到了,然后就进行观摩从里面提取出我需要的一些灵感;在以广泛借贷为主题进行自我设计。
下面让我来讲解一下这个页面是如何完成的:
第一步是先完成顶部:
顶部是由一个#314657颜色的矩形为背景,左边是16字体大小的广发借贷,右边是顶部栏 和一个由圆角矩形做成的搜索框,搜索框里有一个搜索按钮icon
第二步是左边的导航栏:
浅灰色矩形为背景,然后是顶部为黑色,中间为白色的框架。框架里放着用户以及管理员的登录信息与时间,导航栏的信息是:系统首页,总体信息,用户信息,项目信息,追债组织。文字排版靠左边上下对齐,信息间隔有浅灰色矩形隔开,拓展icon 是+,
第三步是内容部分:
白色矩形背景 头部是IP地址 ,接着总借贷额的条形统计图,三种颜色的矩形#f7f7fa,#e50216,#f88d8d进行搭配,#e50216代表着项目总额,#f88d8d代表着项目增长数左侧栏是项目总额的跳动数额;0-20000-40000,底部栏是月份1至5月的变化。旁边是借贷vip,是借贷金额与信誉的排行榜,#f7f7fa矩形间隔文字每个文字都是16字体大小。在接着是行情利息的数据图,每月的波动起伏5000-10000的往上提升。然后是2018年的总收入的统计图,#f6c568, #91c7af ,#61a0a9 ,#314657四种不同颜色的矩形表示了最近几月收入波动起伏较大,然后是2018年总收入额为$108500,销售分析图是由#b9afad矩形和#ed6d30椭圆组成的,最后是管理员的事务,是一个由#d5d6db颜色的矩形组成的表格,表格里是员工的出入信息和日期。
广泛借贷的页面设计就介绍到这里了
感谢你的观看!