《ui设计创意表达与实践肖文婷)配套课件教学课件4-5门户网站设计实例》由会员分享,可在线阅读,更多相关《ui设计创意表达与实践肖文婷)配套课件教学课件4-5门户网站设计实例(17页珍藏版)》请在金锄头文库上搜索。
1、,门户网站设计实例,授课教师:肖文婷,【企业门户网站的基本布局架构】 企业门户网站的基本布局架构主要包括:网站标题和 LOGO;主页(过场动画,可以跳过);多重导航系统(全局导航、局部导航、辅助导航、上下文导航、友好导航、远程导航等); Banner广告;内容位置(公司介绍页、新闻栏、信息栏、产品目录页、产品内页);登录、注册、用户面板、管理后台等;联系方式、留言板、论坛、招聘、客服。,【项目构思与执行】 1、项目背景 卓尔百匠是佛山一家全实木家具品牌,该品牌诞生于2012年,以新中式风格为特色,倾力打造新中式全实木整装家居品牌。卓尔百匠产品原材选取北美的黑胡桃木、白橡木、红橡木与樱桃木,注重
2、可持续性和环保性。随着公司业务越来越大,企业希望在各大家具展会、线下专卖店销售同时,加大对品牌形象的推广力度,充分利用当下互联网的传播方式扩大品牌影响力,在原有的网站平台上进行优化,更精准地突出该品牌定位与彰显产品档次。,原界面设计方案,2、网站定位与结构框架 接到企业项目需求后,查阅相关资料,到实地考察,对产品进行深入仔细的了解。同时对该类型家具品牌的竞品进行调研分析,与企业相关负责人员反复沟通,确认新版网站的定位为具有禅味与人文气质的新中式家具品牌特征。,品牌调性参考图,网站结构框架,3、页面视觉设计 根据前期的品牌定位与风格确认后,将所有的想法通过视觉化的界面设计表现出来。整体页面感觉干
3、净、精致、具有中国元素与禅文化韵味,色调以淡灰色为主,字体选择文悦古体仿宋、文悦古典明朝等笔画纤细但有书法笔触的有饰字体。,新建文档,创建文字导航,导入产品图,导入辅助图,输入主题文案,添加立体背景光影,【产品页】界面设计,【案例页】界面设计,【产品详情页】界面设计,案例详情页】界面设计,4、开发与运营 把客户确认好的设计图进行切片,和后台程序设计师协商,用最省资源的和最方便开发的切片方法来做。开发完成后,设计师检查上线效果,比如文字的大小、元素是否对齐、加载速度、偏色等,再进行后期调整。运营部分一般交付给客户或者代理运营,这时候设计师根据企业要求的尺寸定期更换Banner图和产品图片。,Thanks,