项目背景
上海证券交易所（以下简称“上交所”）作为中国两大证券交易所之一，在面对经济全球化、社会信息化、用户多样化带来的机遇和挑战时，如何充分利用互联网和企业网站，坚持“以用户为中心”，构建好网上金融服务主窗口和上市公司信息披露的主平台，充分发挥其“以客为本”的特点，全面深化上海证券交易门户网站的应用和发展水平，提高民众关注度，提升用户使用便捷度，并扩大其网络影响力，是当前迫切需要解决的问题
研究与策略
这是国内二大证券交易所之一，首次突破传统架构与界面呈现规则的尝试，也是一个创新有趣，充满碰撞的设计过程。
通过2015年改版，对上交所网上服务资源进行系统性梳理，从各类用户视角对服务资源进行重构，实现上交所业务在网络平台上的再整合与集约化；从用户角度出发，对网站内容进行梳理与重构，优化栏目结构和导航体系，提升浏览体验；对网站整体视觉风格进行定制化改造，打造世界一流证券交易所的互联网形象；大幅优化网站功能，重点推出智能搜索、响应式设计、移动APP功能，打造“交易日历”、“上市仪式直播”等若干投资者关心的功能。
原型定义
设计探索
中文版/PC
针对原中文网站栏目层级过深、四五级栏目过多、用户访问体验不佳的现状，本次改版重点对网站栏目体系进行了扁平化处理。整合内容交叉重叠的栏目，淘汰长期未更新栏目，减低冗余度，并对各级栏目名称进行了排查和调整。
在设计探索阶段，根据网站建设不同侧重点，我们给新版网站视觉设计制定三套方案（中英文）：方案一侧重本所官网信息披露内容功能，采用F模型（指用户打开某个网页后的视觉浏览顺序）来整理和排序不同模块、内容的优先级。方案二侧重本所业务及企业形象宣传。方案三则根据交易所国际化定位，侧重面向国际的全球化品牌形象展示，设计风格相对较前卫。
英文版/PC
根据国际用户需求，对原栏目体系进行增、删、改，增设“产品”、“法律规则”、“指数与数据”等一级栏目，弱化展示上市等国际用户相对不关心的。
APP开发
上交所移动端app，风格上与新版网站、wap版保持一致，而且采用混合模式，直接复用部分移动版栏目。其英文版栏目结构则将限定于本所形象宣传相关内容及其它国外用户比较关注的内容。
创新技术
上交所开发将摒弃原有的div+css+table前端混合编码模式，全面采用Html5及Css3技术，除了能提供更多网页特效，提升用户体验，增加网站的可访问性、可用性，使网站能适配更多的设备外，还可以加强网页编码效率，减少开发与维护成本，提升网站性能。其次由于目前移动终端中IOS系统的日益普及，将进行网站行情前端展示系统的Html5升级改造，以满足IOS系统访问需求。扩展网站的通用性。
Bootstrap框架开发
Bootstrap是基于HTML5和CSS3开发的，它在jQuery的基础上进行了更为个性化和人性化的完善.
制作元件
企业版设计稿以及内容元件（表格元件，列表元件，查询元件，其他元件，文章详情页面）。
项目总结
上海证券交易所官方网站改版视觉设计项目从2015年6月15号至2016年01月23号经过7个月的努力正式上线
12
人参与
5854
个小时
300
多张设计稿
18
G文件大小
