前言：
其实不管是1.0还是2.0，我做的动机背后都有一些故事（当然在这之前的故事，我这里就不讲了，因为故事中还有故事），而这些故事也是我的经历和历练，也是品牌的历史。这里2.0的改版升级背景和动机，我就不再说了。
2.0是一次全新升级革命：
为什么这么说呢？因为从模式上和需求展示上开始强势的转型，紧贴客户需求。我在做2.0的时候看着1.0其实有一种焦虑感，我在想如何在1.0的基础上进行全新打造，更好的作为一个需求解决方案平台，更好的服务于客户，如何满足客户的需求；如何结合个人品牌特色并且转化在网站中展示出来，向客户传达信息，体现市场需求匹配以及如何更好的打造宣传个人战略品牌。
心得体会：
本次2.0的打造对我来说是一次技术的提升以及思想境界提升。我也深刻的体会到了文案方面，文字的魅力，多一个字少一个字都有区别的。设计方面（用到的一些元素样机素材，多数是国外素材，也是精心挑选的），我也是在1.0基础上进行过渡升级，精心配合文案来设计，突出重点和需求，边设计变考虑响应式体验，同样，写2.0的代码我也是得到相对的提升，我是全手写的响应式（考虑到现在是移动互联网时代以及后续维护成本），我是要达到在各种设备上获得更完美舒适的用户体验；所以大部分时间用在用户体验上。
其实我在做2.0的时候考虑了部分3.0的东西的，不管是设计还是写代码的时候我都有想到后面3.0迭代的因素，我都考虑在内的，比如导航3.0可能有二级菜单等等），在做2.0的时候，我也做了部分3.0的东西（也浪费了不少时间，将近半个月），后来因为时间关系，就没继续做那部分了直接掐掉了，这在之前我发布的2.0正式上线的文章有提到。但是现在我的想法有了些改变，3.0我可能不会在2.0的框架上来做。
总之。2.0的打造，可以说是把我迄今为止所学的东西全部运用在上面。如果不讲业务，从另外一个方面来理解和浏览网站，你会发现和体会到其实你看到的不仅仅是网站，而是我！看到的是一种思想，一种灵魂，就像我在网站上也看着你一样。所以这次2.0的打造是哲学，心理学，营销学，美学，以及技术等的结合（在做3.0的时候我会研究得更深入一些），相比1.0有了质的飞跃，但是1.0我也留着的，因为没有1.0的尝试也就不会有2.0突破。每一个字，每一像素，每一行代码里面有我的心血和灵魂。说人站合一其实也不夸张，熬着过来的，只有经历过的人或者志同道合的人才会懂其中的含义。
——【2.0】——
2017年11月20日至2018年03月28日：
说明：具体时间我就不像1.0介绍那样分段了，因为中途有的是同时做的，以及中途我接了些业务在做，有的因为其他原因耽搁了部分时间，我这里就统一说了。
-
本次2.0的打造加上后期测试修改共计耗时将近3个多月，最后到3月28日正式发布。
-
2.0我进行了精心的策划以及拟写一些文案，后面实际做的时候然后有一些改变。
-
下面的介绍有些部分我会和1.0进行相关对比说明
附上当时的设计效果图：
2.0版本主要做了以下主要个页面（在1.0的基础上进行延伸）：
-
我的首页
-
APP设计
-
我的首页
-
网页设计
-
平面设计
-
前端切图
-
个性地图
-
合作共赢
-
文化理念
其他页面和小功能：
-
新闻中心
-
网站地图
-
在线调色
-
扫码付款
-
站长名片
-
收藏本站
-
侧边栏（这个其实1.0也有的，只是在2.0进行了优化和调整）
1、我的首页
-
顶部及导航核心
头部及导航核心部分展示：品牌LOGO，专注核心关键词，联系方式、信息弹出展示、1.0入口
-
顶部轮播切换 banner
我主要是用文字进行动画特效展示，配以简短文案进行点缀。第一页并且突出本站域名以及专注领域和解决方案；第二页，强调文化理念和服务态度。可以说是开门见山。也是一种思想的转变。
-
承接项目
分需求把承接项目类型进行统一展示的设计方式，直接明了，精心配色以及搭配文案，强调重点。其实也是我的一种思想体现。
-
设计切图
分别对设计/切图解决方案进行了详细的服务说明，配上服务项目宣传图片，服务内容，服务优势，排版简洁，更利于客户匹配需求。颜色搭配上明亮又稳重。
-
配色之道
这个延续了1.0的文案，变换了特效风格，显得更加立体的展示配色的玄机和奥秘，让客户了解其中的道。
-
服务放心
把客户关心的问题进行解答式的展示，同时包含自主品牌体现。其中包括：
-
【标准化分析需求服务】：需求分析流程以及沟通结果
-
【精准用户需求定位】：需求定位，定位需求市场，需求用户，需求特点，并且给予反馈
-
【专业UI/设计外包】：根据产品需求进行相关设计和体现
-
【专业前端外包】：直接体现前端切图优势，体现代码专业性
-
【无缝对接修改】：解决用户产品验收问题疑惑，上传云端，实时查看浏览修改。
-
【始终坚持合作共赢理念】：用心解决客户需求，提升企业品牌竞争力
-
交易流程
这也是客户比较关心的问题，同时减少部分沟通成本，这里直接说明了以下几个大点：
-
需求与报价
-
确定意向->预付定金->开始工作
-
项目完成->尾款接收->后期维护
-
客户信赖
表达赢得客户信赖的原因，将客户需求，客户想法进行转化，理解重视并且提出相关意见，总结每次合作收获，总结长期战略合作方向。
-
肩负使命
表达本工作室所肩负的使命，解决主流市场用户需求的使命以及介绍核心思想体现。
-
您需要？
介绍核心业务类型，在页面下部分再次展示，让客户再次了解匹配需求，加深印象，以及对本工作室的所承接业务进行传达。
-
联系站长
介绍我的联系方式，QQ、微信号、以及在线咨询。
-
友情链接
其实这个是战略链接，下面的站点是我做的战略品牌网站以及战略计划，当然，也是自我品牌链关联和自我实力体现，也就是品牌实力体现。
-
footer
本次2.0对页脚进行了丰富，包含了业务范围、网站域名体现。联系方式、备案许可、百度统计、360网站安全检测。是业务的体现以及品牌信赖的体现。
2、APP设计
-
banner设计
深灰色的的背景配简洁中心设计思想的文案，加上背景大气样机图（这个样机内的APP界面设计是我以前做面试作品，我在1.0中有说道，一直作为本站的纪念），让客户浏览起来感到一种开阔和心灵上的愉悦，更愿意品读和享受文案中的含义，以及体现APP设计的魅力和实力。
-
用户体验
左右搭配，进行APP设计的优势及用户体验说明，并且在下面排列几个关键点与客户关注点。
-
案例推荐
利于瀑布流插件进行布局加载，以瀑布流的方式进行展示，简单而丰富，进行实力展示，用户可点击查看与交互体验。
点击后可查看原图：
3、APP设计
-
banner设计
延续1.0的风格，进行优化设计，背景采用格子平铺，文案采用明亮的白色，突出高端的高字，说明网页设计优势。
-
案例推荐
之前上线的时候我是留着的，现已经不展示，并计划在3.0单独归类展示。
-
分类说明
进行分类说明网页设计优势及特点，把以下的内容先进行一个小导航分类展示，起到预知性的作用。
精准定位用户需求
量身定做用心设计
跟随潮流发展趋势
安全高校提供保障
-
网页类型
提供主流网页设计类型，并进行对应的说明，达到类型匹配：
-
企业官网类
-
信息资讯类
-
产品服务类
-
地方门户类
-
商务咨询类
-
个人品牌类
-
核心文案
以高端企业红背景配以文案的方式，体现自我品牌实力，并且把握企业关注点——品牌形象。
-
您的关注
把握企业关注点以及市场需求，并且承上启下，进行详细介绍优势极其特点。
4、平面设计
-
banner设计
采用紫色背景并配合文字排版的优势，进行直接传达平面设计方面的提供服务以及品牌的自我宣传。
-
三生万物
三生万物这里我的思想是以哲学的思想进行解读，把平面设计的三要素进行介绍。
-
案例推荐
平面设计相关LOGO设计展示，同样是瀑布流展示。现已经不展示，并计划在3.0单独归类展示。
-
设计之道
将道与设计进行无缝结合说明，把设计中的美和含义用一种独特的方式让用户理解品味，也是一种境界的体现。说实话，这里我想了半天。
-
包含范围
以色块文字的方式展示平面设计项目包含范围，简单而有序，利于浏览。
5、前端切图
-
banner设计
【网站前端，专注切图】直接指向本工作室前端方面解决方案核心。并且介绍了相关前端切图类型。同样，左边配图，利于用户理解和效果展示。
-
设计切图流程
这里我把设计和切图同时进行了一种仪表盘的设计，因为有时候的需求是设计和需求一起的，这样展现显得不枯燥并且有简单的交互，能让用户得到部分体验的小惊喜。
-
我的代码风格/切图类别，代码语言
这些模块延续1.0进行了优化和补充设计，目的是为了更完善服务用户的需求。这里我就不说了。
-
H5设计切图（制作）
体现H5在移动互联网时代的优势，并且以自主品牌进行展示。这部分我暂时以设计的是图片的形式展示的，当然，现在我也在开始把它做成H5了，然后部署另一个战略。
-
H5流程
以青春明亮的色块搭配文案说明制作H5的步骤，介绍H5项目从需求到完成的流程，让客户了解每个步骤并放心。
6、个性地图
-
banner设计
延续1.0风格进行优化设计，体现科技感和以及表现地图。
-
个性展示
个性展示企业位置电子地图坐标，同样，调用百度地图API，但是功能列表相比1.0更丰富了。这一模块也是企业网站中不可缺少的部分。
7、合作共赢
-
banner设计
【诚信赢天下】本工作室创始以来，一直以诚信面对社会，以实力铸就辉煌。以大气的背景加上文字配以金鼎，强调诚信的重要性。
-
成功合作
以滚动的方式展示合作的企业和项目，从另一个角度展示本工作室品牌的实力。
-
共赢理念
【深入共赢理念，与企业共同成长】表达了我愿与各企业合作的远景，同时表达了解决用户需求，提升品牌影响力的优势。
-
专业软件
展示了在项目【设计/前端切图】中所用到的软件，展示专业性以及品牌实力。
-
本站简介（本工作室简介）
主要介绍了以下几点（本来我是打算用时间轴做这部分的效果的，当然2.0或许暂时我还不会动，但会在3.0中体现）：
-
创站历史：这块之前是有的，但是现在我没展示出来了，我会在3.0的重点打造这一部分。
-
168命名：工作室命名含义以及愿景
-
品牌说明：品牌网站用来干什么，品牌创始人以及我的联系方式
-
站长使命：表达我的使命，也就是本工作室的使命以及介绍承接项目
-
站长简介：我的个人简介。我后面做的品牌站和战略站，欢迎访问收藏：我的的名片：http://card.liuyao168.com/ 我的简历：http://i.liuyao168.com/
-
感谢客户：主要说明了客户的选择让我成长，以及共赢理念
-
特别鸣谢：本站宣传配音来源，感谢朋友的配音支持。
-
工具项目
延续1.0进行优化设计，并且加上品牌特色背景水印，让文字不再单调。主要介绍了开放工具及语言，承接项目。
-
联系站长
这个很明显了吧，是我的联系方式，前面有说道，但是在这个页面为什么要在出现呢，其实也是我的一种策略，为用户/客户着想，因为如果有意向了，可以直接在这里联系我，显得更方便，利于用户体验。
8、文化理念
-
文化和理念主要以下8点（我=本工作室）：
-
详细沟通是重点
-
以客户产品为导向
-
合作流程规范化
-
注重客户满意度
-
我的使命
-
我的服务理念
-
我的愿景
-
我的价值观
9、新闻中心
顶部以文案直接展示本工作室提供解决方案，让用户/客户浏览的同时也会加深记忆以及需求匹配率。
该页面信息原作为公告信息发布，现已经转到 刘瑶168设计切图工作室新浪博客 和刘瑶的博客 ，3.0的时候我会重新打造这部分。
10、在线调色
2.0新做的在线小工具，简单而实用，方便调色，也是一个升级的亮点，同时体现了本工作室注重色彩搭配。
11、网站地图
作为网站的导航入口，进行归类，有利于搜索引擎收录。
12、收藏本站
顾名思义，小提示收藏并得到技术支持保障。
13、扫码付款
便捷的弹框，减少交易繁琐流程。
14、站长名片
便捷的弹框，我的名片，方便扫码记录并可存入通讯录，方便联系沟通。
15、侧边栏
作为网站的侧边栏，起着很重要的作用，因为始终是固定在页面右侧，方便随时沟通。
只要包括6个小类目：
-
承接项目
-
扫码付款
-
在线咨询
-
QQ 咨询
-
微信咨询
-
意向反馈
16、关于配音
配音宣传这个想法，其实开始做的时候，我没想到，但是后面我觉得2.0上线后是发布全新版本，相对与于1.0来说是一次全新的革命，要通知一下，同时还可以做品牌宣传，于是我就想到了配音。
17、BAE换成云服务器
后面因为BAE基础版已经停止维护了的原因，我换成了云服务器，其中的细节我就不多说了。
——【结语】——
其实做1.0的时候，我就已经有品牌意识了（当时我在QQ空间有发表，现在看那时候说的话好像有点幼稚[滑稽]，但是想到敢于尝试，想起来还是挺欣慰的，一路走来，也不容易），不过那时候了解和学习的还不是很多。2.0的打造把我至今所学进行了全面展示。
2.0相对于1.0是一次全新的革命，无论从文案和服务，以及网站设计和用户体验（响应式等等）来说，都是全新的蜕变。
而且本次2.0的打造我也用到一些插件库，利于它们让想法更容易实现，也让我在技术方面提升了不少；当然，从1.0到2,0的过程中，我记了无数的笔记，小到一句话也会记，因为有时候就是这句话能找到灵感找到解决办法。
本次2.0是后面我做3.0的一次过渡，3.0即是二次革命，将更全面精细化为市场需求服务。我把品牌历史写出来的目的之一就是我后面做3.0的时候，我会来看我写的文章，或许能找到一些灵感并且运用到3.0上，更好的服务于客户，解决产品用户需求。
到此，本工作室的来历以及品牌的历史打造过程我就介绍完了，也写了这么多，都是心里话和感触。感谢您的阅读，有什么想法心得和意见可一起交流哦，共勉！
扫描二维码收藏
