维生数工作室运营方面的资料

1. 从网站制作流程谈运营组的定位
By Chain Lee.

2. 网站制作的流程
 市场经理：调查市场需求
 产品经理：构思产品，将需求转化成功能
 产品定位
 目标市场
 发展与推广策略
 技术组：制作产品
 平面组：设计页面
 前端组：信息框架搭建，制作页面
 后台组：设计数据库，绑定数据
 测试组：产品测试
 产品推广

3. 第一步：进行市场需求调查
 挖掘需求
 确定需求群体
 评估需求的价值
 考虑能否做成产品
 确定需求
 目标群体调查（问卷和采访等手段）
 用户习惯调查（消费水品、常用设备等）
 信息汇总

4. 第二步：需求转化成功能
 构思产品原型
 社区类、交友类、展示类等
 按需求设计功能
 捉住核心需求，定制主要功能
 从主要功能发散列出辅助功能
 删去多余的功能
 场景模拟
 用户逻辑导向图

5. 需求转化

6. 产品地图

7. 什么是场景模拟？
 角色设计
 设计人物
 场景设计
 根据人物设计场景
 模拟人物动作
 作用
 模拟用户操作
 根据操作制定信息框架

8. 举个例子
 角色一：杨琳(主要目标人群)
 性别：女
 年龄：21岁
 职业：大二学生
 性格：外向，开朗，擅长与人交往
 兴趣爱好：兴趣广泛，喜欢和朋友出去玩，喜欢平面设计，经常浏览设计类杂志和书籍。

 互联网使用情况：
 网络年龄8年。每天上网时间4小时
 上网经常做的事情：浏览朋友的博客和空间，上站酷等网站浏览优秀的平面设计作品

 个人描述
杨琳是一个性格开朗的人，喜欢结交朋友，喜欢接触新鲜事物，而且她是一个数字媒体专业
的学生，因此她对平面设计有浓厚兴趣，平时她会花钱买一些设计相关的杂志，也经常到图书
馆借阅相关类型的书籍。
杨琳平时花在网上的时间不算长，上网的时候她经常浏览如站酷等一类设计网站，顺便更新
一下自己微博信息，和QQ好友联络。杨琳打开电脑大部分原因是用PS画图而不是用电脑娱
乐，但喜欢新奇事物的她也会到微博上看看好友的动态和搜罗一下最近的新鲜事情。
 用户需求：
快速搜索到书籍相关信息（包括介绍，评论，相关书目）
借到图书馆没有馆藏的图书
认识与自己有共同爱好的人

9. 接上例子
 杨琳角色场景
 一个炎热的下午，杨琳来到图书感避暑，顺便想就借阅一些设计类的书籍。她在书架前扫了
几眼，然后从书架取出一本名字挺吸引的书，翻看了一下里面的内容，觉得还不错。随后她又抽了
几本感兴趣书，但是她不想借那么多本，这个时候，她掏出手机，打开了“想享图书馆”的主页，点击
了“找书”功能按钮，进入到拍照搜书功能，对准其中一本书的ISBN条形码进行拍照，随后系统马上
准确地找到该书的详细资料。杨琳逐本书进行搜索，了解这几本书的更多详细资料，同时她在各本
书的详细资料页面上查看到其他用户对这本书的评分和评论。经过一番斟酌，杨琳决定借其中的一
本书。而在几次搜索过程中，杨琳发现在书籍信息页面上的“同类书籍推荐”一栏上出现了同一本书，
于是杨琳点击链接进入到该书的页面，浏览了该书的详细信息和用户评价，发现这的确是一本好的
书。可是这本书在学校的图书馆并没有库存。杨琳在该书的信息页面上看到这本书有一条“想借”记
录，杨琳马上点击查看详细记录，发现这是一个本校的用户发布的信息。她点击记录中发布人的头
像，进入到发布用户详细资料页，查看了该用户的宿舍地址和专业等资料，翻看了一下对方的借阅
记录，觉得这个用户的信息很可靠，于是她点击了页面上“申请借阅”的按钮。系统马上提示“申请借
阅成功，请等待对方回应”，杨琳知道自己操作无误，于是拿起刚刚挑好的书往柜台走去。
 傍晚时分，杨琳的“想享图书馆”收到一条匹配信息，杨琳从主页面的快捷键进入到匹配信息
列表，看到有一条新的站内信，内容是今天中午的借阅申请已经得到答复，对方愿意出借书籍，并
询问杨琳什么时候方便拿书，希望能通过电话联系确定。杨琳想了想，按下站内信中“CALL”的按
钮，拨通了对方的号码。电话拨通后，杨琳礼貌地向对方打招呼，并询问对方是否有空，得知对方
有空后，杨琳提出现在到对方宿舍拿书，对方欣然答应了。杨琳开心的挂了电话，来到书主的宿
舍。借到书后，杨琳在“想享图书馆”的匹配信息中点击了“成功借取”的按钮，系统马上提示书籍状况
已更改。借书之余还和书主聊了起来。在交谈过程中杨琳发现她与这位同学挺投契，杨琳聊了很久
才离开。

10. 什么是信息框架？
 信息的布局
 不同信息页面的安排，页面间过渡
 页面逻辑导向图
 页面交互——触发的事件
 制成页面信息框架图

11. 什么是页面逻辑导向图？

12. 什么是页面逻辑导向图？

13. 什么是信息框架？

14. 点击注册后

15. 点击听广播后

16. 点击看电视后

17. 第三步：制作产品
 3.1 按照页面逻辑导向图制定信息框架（页面交互）
 3.2 后台组按照信息框架设计数据库
 3.3 平面组按照信息框架进行视觉设计
 3.4 前端组根据设计制作页面，添加动态效果
 3.5 后台组用页面成品绑定数据
 根据这个流程说说每个组分工

18. 平面组
 主要工作：进行视觉设计
 配色
 布局
 UI设计
 掌握技能
 色彩、文字、布局等设计基础知识
 用户体验知识
 前端代码工作方式基础
 使用的软件
 PS,Ai等软件

19. 前端组
 主要工作：信息交互、切片
 根据功能和页面逻辑制定信息框架
 根据视觉设计稿制作具体页面
 掌握技能
 交互与用户体验
 切片（即页面架构）
 使用的语言：
 HTML + CSS + Javascript
 各种框架

20. 平面组与前端组
 什么是切片？
 把平面组的视觉设计稿制作成可操作的网页
 平面组：把网页画出来
 前端组：把网页写出来，告诉浏览器网页是怎样的
 两个组配合工作方式
 平面组与前端组研究信息框架与交互设计
 平面组根据结果进行视觉设计
 前端组根据视觉设计制作页面

21. 细节问题
 平面设计稿对于布局的严格要求
 了解CSS布局原理
 前端对于页面优化的技术
 图片处理
 掌握基础PS技能：切片、标尺、图片格式选择
 讨论与调和矛盾
 基于信息框架
 呈现设计
Q&A?

22. 后台组
 主要工作
 设计数据库表，搭建数据库
 搭建逻辑层，完成数据库与页面的数据交互与绑定
 掌握技能
 逻辑层编写
 数据库搭建
 主要语言
 ASP.NET + SQL Server
 PHP+MYSQL
 JSP , python , Ruby …

23. 前端组与后台组
 如何工作
 前端设置好网页看起来是怎样的
 前端写好这里应该放什么
 后台把东西放进去
 好处
 后台不用理会网页外观，能专注于数据库搭建和信息绑
定

24. 后台组细节
 在确定信息框架后，后台组的数据库搭建可以与视觉
设计同步开始，同时设计逻辑层
 等前端组切片工作（网站架构搭建）完成之后，进行
数据绑定
 数据绑定完成后，把网站放到服务器端，并设置域名
等

25. 初期信息填充
 版权信息
 联系人员、制作人员、客服
 前期信息
 如网站介绍等能支撑起网站运行的信息
信息填充与后台
反馈信息放置位置是否有误
反应后台可用程度

26. 产品测试
 找bug
 不断折腾产品，用尽方法把它搞垮
 压力测试
 模拟大量用户使用，测试服务器和网站抗压能力
 用户体验测试
 请人使用产品，记录用户使用习惯时候与预期一样
 记录用户用的不爽的地方
根据以上问题改进产品

27. 产品推广
 在产品设计初期就要制定推广方案
 制定信息框架后开始推广方案设计
 与网站制作工作同步开始
 线上
 微博、论坛发帖、QQ群、广告等
 线下
 传单海报、线下活动、商家合作
 用户反馈信息收集及后续功能完善

28. So, this is it.
 市场经理：调查市场需求
 产品经理：构思产品，将需求转化成功能
 产品定位
 目标市场
 发展与推广策略
 技术组：制作产品
 平面组：设计页面
 前端组：信息框架搭建，制作页面
 后台组：设计数据库，绑定数据
 测试组：产品测试
 产品推广

29. 运营组的定位
 除了技术工作之外的环节
(⊙o⊙)~纳尼！

30. 运营组的历史
 雏形
 为工大在线新闻网更新信息
 新闻资信部为主，各部门参与
 建立
 09年的暑假实践
 为新生网资料填充与推广
 来自各个部门的组长，工作室的技术人员
 发展
 10年暑假实践
 新生网的延续，女生节专题网的运维

31. 运营组的工作
 交付技术制作之前
 需求挖掘
 产品构思
 需求到功能的转换
 交付技术制作之后
 资料填充
 首批测试人员
 制定推广策略并实施
 资料维护
 用户反馈

32. 举个例子
 新生网
 几乎没有制作前期的讨论，直接开始制作
 资料填充，与后台的对峙
 推广方式的探索
 女生节专题网
 暑假实践的讨论
 不断修改不断完善
 与线下活动结合的推广方式

33. 活动网
 网络展板
 发展社团的力量
 与社团合作的方式获得社团资源
 需要我们制定合作方向和策略
 线上线下结合的方式
 逐步过渡到个体
 校内交友
 校内活动组织
 分享活动
 校间交友

34. 对未来的设想
 运营组还在摸索阶段
 知道自己的定位去工作和学习
 构思网站，培养创新思维
 摸索更好的推广方式
 摸索与其他社团的合作模式
 了解学校的状况
 培养好沟通能力和待人处事方式
 培养每个人的职业病！
 玩互联网新奇的产品
 把IDEA做成网站

35. That’s all.
 Any question?