| 这个作业属于哪个课程 | 2023年福大-软件工程实践W班 |
|---|---|
| 这个作业要求在哪里 | 要求在这里 |
| 这个作业的目标 | 分析网上上比较常用的几个编程网站，对他们进行评测，指出优点及缺点，体会软件工程思想及原则在软件开发中的重要作用，提升自身认识，并为相应产品迭代提出自己的合理建议。 |
| 其他参考文献 | 1、bug定级标准 2、软件评分细则 3、邹欣老师的案例分析作业要求 |
前言
1、BUG评级标准
在对三款编程网站进行评测的过程中，会涉及Bug评定和分析，为了避免文档的重复冗余，在正文开始前给出BUG评级标准如下：
| BUG严重程度 | 类型名称 | 评判标准 |
|---|---|---|
| ★★★ | 严重错误 | 1、常规操作引起的系统崩溃、死机、死循环报错，无法正常退出 2、功能设计与需求严重不符，基本模块缺失，测试流程无法进行 3、严重的数据计算错误 4、用户数据丢失或破坏 5、内存泄漏，系统无法登录 6、其他导致功能无法测试的问题 |
| ★★ | 一般错误 | 1、重要功能不能实现（例如：用户所要求的功能缺失，该有的页面未实现，逻辑不通，重要图表数据未开发，等） 2、错误的波及面广，影响到其他重要功能正常实现 3、非常规操作导致的程序崩溃、死机、死循环 (非常规操作：用户使用软件时不会进行的操作） 4、系统中数据保存后数据库中显示错误5、密码明文显示6、页面无显示白屏，无数据 |
| ★ | 轻微错误 | 不影响产品的运行、不会成为故障的起因、但对产品外观和下道工序影响较大的缺陷 1、次要功能不能正常实现 2、操作界面错误（包括数据窗口内列名的定义，含义不一致） 3、查询错误、数据错误显示 4、简单的输入限制未放在前端进行控制；（格式显示，如登录和注册中的格式判断可由前端判断） 5、删除操作未给出提示 6、边界条件错误或者未做限制 7、系统未做优化，数据页面加载慢，操作卡顿之类（性能层面问题） 8、兼容性问题（分辨率，系统版本等等） |
2、软件推荐程度评级标准
在给出推荐程度时先根据邹欣老师的：现代软件工程 团队作业 - 软件分析和用户需求调查对软件评分，根据评分结果给出推荐程度等级：
- 90~100：非常推荐
- 80~89：好，不错
- 70-79：一般
- 60-69：不推荐
- 60分以下：非常不推荐
1.三款编程网站的调研和评测
1.1 InsCode
1.1.1 关于InsCode
InsCode是CSDN平台内置的代码审查工具，可以直接在CSDN上进行使用，无需进行繁琐的安装和配置。且InsCode支持多种编程语言，包括Java、C++、Python等，覆盖了大部分的开发语言。
1.1.2 页面布局
一、主页
网站主页采用顶部导航栏+左侧边栏+卡片式内容的布局，整体风格清爽简洁，没有乱七八糟的广告，给人的整体观感还是很不错的。
主页的“关注”部分，同样采用了卡片式的布局，给出了用户关注的作者的最新动态，如果没有关注者，则会给出一些优秀创作者的动态，通过卡片的内容，可以看到发布的作品的浏览次数、评论次数和收藏次数，可以帮助用户快速了解一个作品的质量。
二、我的项目
同样是非常地简洁明了，整体的配色和背景搭配给人感觉非常高级。（甚至让人怀疑这到底是不是国内网站(bushi)
三、模板中心
与首页一样的布局模式，同样的卡片式布局，且模板的分类非常清晰，方便用户快速检索。
四、社区
社区模块采用了经典的圣杯布局，即“头+左+右+中间+尾”的模式，中间的内容部分同样以卡片形式展示内容预览，可以看到内容浏览量、评论数、收藏数以及更新内容概述和部分评论。
五、设置
设置部分就不必多说了，常规内容 ，硬要说的话还是那句话，简洁明了。（bushi）
1.1.3 功能体验
功能一、创建项目
创建项目后需要先选择模板，否则无法填写其他部分。我这里先选择了一个Java 的模板，然后编辑了一下项目信息，最后点击创建项目。
接着就进入了编辑器页面：
但是在使用编辑器的过程中感觉很痛苦，因为网页中完全没有与该模板有关的教程，对于像我这样完全没有接触过在线应用模板编程的用户很不友好，然后我就按照自己的经验在Main.java中添加了一行System.out.println("what's your name");：
然后点击Run，想看看会不会正常输出，结果完全没有变化，还是只有一行“Hello world!"
这就很无语了，于是我跑到百度、CSDN、B站搜索了关于InsCode的教程，但几乎都是无用信息：
我甚至去问了ChatGPT，它给出的方法也不清不楚的：
最后，我找到发布这个Java模板的作者，心想作者发布模板总归有教程了吧，结果还是没有：
这波操作下来直接给我整无语了，前面网页页面设计给我的好感也直接清零了，敢情我创建模板编辑了个寂寞。。。
然后我换了个名叫Dart的测试模板试了一下，加入了一行print('what\'s the problem');，然后点击运行：
在控制台正确输出了，为什么这个模板就可以啊。。。
这波体验下来让我感觉这个网站对新手很不友好，缺少入门的教程。CharGPT却说InsCode是一个很好的编程教育平台，反正我个人觉得在InsCode给每个模板都出一个教程之前，我是不会再用了。
功能二、发布作品
在我的项目页面点击发布作品，可以选择以创建的项目发布，这里我选择发布一个Dart项目：
这里我测试了一下，如果不填标题，会提示请填写项目标题：
如果不填项目标识，会提示请填写项目标识：
如果不填写描述和标签，会提示参数错误：
然后又一个很无语的事情发生了，我完整地填写了所有需要的信息，它还是提示参数错误：
该填的都填了还不让我发是什么意思，关键是也没说都要填啥啊，还有参数错误到底是什么参数错误，是哪里还需要修改也不说清楚，就说一个参数错误我都不知道是服务器的问题还是我的问题，这让我怎么改啊。。。然后我就摆烂了（= =）。
功能三、项目管理
在我的项目页面，大致分为以下几个功能：个性化、个人项目管理、个人动态、个人收藏。
个性化支持自定义头像和个人主页背景。
个人项目管理中可以看到自己创建的项目，支持项目的编辑、删除、fork（但是自己fork自己是什么意思）：
在个人动态页面，可以看到个人的评论记录、星标记录、关注记录、更新记录：
星标页面可以看到自己收藏的作品、模板，无法查看别人的星标。
功能四、社区
体验了一下社区的功能之后，发现了以下几个问题：社区性不明显、缺少内容搜索功能、发布作品功能在"我的项目"中无法使用而在"社区"中可以使用：
-
社区性不明显
虽然是社区页面，但是感觉页面内容就像很多不同种类的内容堆叠出来的，没有传统社区的加入社区、浏览指定社区内容、在指定社区发布作品等等功能，与其说是社区，不如说是展示了所有更新的作品和模板的页面。 -
缺少内容搜索功能
社区页面是没有搜索框的，使用顶部的搜索框也无法搜索社区内容，整个页面能够支持类似搜索功能的只有右侧的热门标签，而热门标签的分类能力有限。这就意味着用户如果想在社区中查找指定内容，只能通过不断下拉页面自行查找，在此过程中，用户可能因此浪费大量时间，对用户体验是极不友好的。 -
发布作品功能在"我的项目"中无法使用而在"社区"中可以使用
上文中我在"我的项目"页面中尝试发布作品，出现了无法理解的参数错误，而在社区页面中，这个错误神奇地消失了。。。
这里我填写了和上文一样的信息，点击发布：
发布成功了，作品进入了审核，这就不得不让人确定之前的参数错误是网页服务器的bug了，用户的填写应该是没有问题的。
功能五、设置
设置页面主要是设置一些基本信息、SSH公钥和Git配置，以便从Gitcode中导入项目或将项目修改同步到GitCode。
但是有个地方我不太理解，为什么用户名只允许修改一次呢？是出于什么样的考虑呢？这个问题我想了一会儿也没想出答案，只是感觉这样的设计对用户也太不友好了，如果我就是很喜欢改名字咋办？
1.1.4 优缺点分析
-
优点
1、页面风格简洁清晰。 InsCode没有插入广告，给人的整体感受比较高级舒适。
2、功能多样。 InsCode除了主要的代码在线编辑功能外，还支持与Gitcode关联进行项目管理，而且还支持社区交流，可以查看、fork其他用户的项目进行学习。
3、丰富的模板资源。 InsCode的模板中心包含多个应用领域的模板，如AI应用、网页设计、游戏创作、图形编辑等方面的模板。
4、支持多种编程语言。 InsCode支持多种编程语言，包括Java、C++、Python等，覆盖了大部分的开发语言，无需进行繁琐的安装和环境配置。 -
缺点
1、缺少网站的入门教程，对于已发布的作品或模板也没有相关的使用说明。 使用一个比较陌生的模板时，完全不知道如何下手，甚至对于熟悉的模板，也会因为不熟悉在线编辑器的使用方法出现无法理解的错误（就像一开始的Java模板一样，完全搞不懂为什么无法正常输出）。
这里我截选了一些模板和作品的评论，可以看到大部分用户是不清楚模板应该怎么使用的：
2、部分功能不完善。 比如在我的项目中发布项目会出现不明原因的参数错误；社区页面并没有体现出社区该有的特性（如社区划分等）。
3、页面UI设计不合理。 比如在社区页面中没有搜索框，导致用户需要查询某些资源是需要不断下拉页面自己查找，十分浪费时间。
1.1.5 改进意见
1、可以尝试像GitCode一样写一份网站使用说明，为网站的新用户提供一份入门教程。同时可以在创作者发布作品时添加一个项目说明书选项，引导创作者为自己的项目添加使用教程，方便其他用户了解模板的使用方法。
2、建议加强对应页面的功能性。比如在项目管理中却无法发布项目，应该算是一个比较大的bug了；社区页面建议可以为不同语言或不同应用领域的项目单独划分一个社区，方便对应社区的用户交流。
3、添加一些便于用户与页面交互的UI组件，比如为社区内容添加一个搜索框。
1.1.6 Bug描述及分析
1.1.6.1 测试环境
操作系统：Windows 10 家庭中文版
浏览器：Google浏览器 版本 111.0.5563.147（64 位）
1.1.6.2 网页存在的Bug
Bug1：创建项目时搜索不到对应模板
1、Bug评级： 轻微错误（★）（对应查询错误、数据错误显示）
2、可复现性：偶然发生
3、Bug描述：
首先我在第一天创建项目时，选择模板时是可以直接在下拉框找到Java这个模板的：
但是到了第二天，我再次创建项目时，在下拉框中就找不到Java这个模板了，甚至无法搜索出来：
但是在搜索框中搜索Java后，可以看到在模板里面是有Java这个模板的：
4、Bug可能成因：
（1）首先可能是因为数据库操作的查询语句出现问题，导致无法在前台页面正确渲染。
（2）还有一种可能，是因为我已经创建的项目中已经包含了以Java为模板的项目。提出这一假设的理由是，我在创建的项目中还有一个以Dart为模板的项目，我同样无法在创建项目时找到Dart这个模板。如果是这个原因，看似好像不是Bug而是用户个人行为导致的，但我认为，一个模板只能创建一个项目也可以算是一个Bug，按照用户使用习惯而言，一个模板应该可以创建多个项目才对。
5、改进措施
- 如果是成因（1），
检查后台数据库查询语句是否有误，若有错误进行修改。 - 如果是成因（2），修改项目创建时的底层逻辑，使创建项目时的模板选择不要被
已创建项目中是否已包含这一模板限制。
Bug2：在“我的项目”页面发布作品无法顺利发布
1、Bug评级： 一般错误（★★）（对应重要功能不能实现）
2、可复现性：必然发生
3、Bug描述：
这里我在“我的项目”页面发布作品时，完整地填写了发布作品所需的所有信息，点击发布后会提示参数错误：
然而我在“社区”页面发布作品时，填写了一样的信息后，却能发布成功：
之后我对其他项目进行了相同操作也是一样的结果：
4、Bug可能成因：
- “我的项目”页面的“发布作品“对应的后台代码有误。
5、改进措施
- 找出“我的项目”页面的“发布作品“对应的后台代码，参照“社区”页面的“发布作品对应的后台代码进行修改
- 也许两个页面“发布作品”对应的代码逻辑不同，此时需要对“我的项目”页面的“发布作品“对应的后台代码进行复审纠错。
Bug3：社区页面缺少社区内容搜索框
1、Bug评级： 一般错误（★★）（对应重要功能不能实现）
2、可复现性：必然发生
3、Bug描述：
社区页面中没有社区内容的搜索框，导致用户需要查询某些资源是需要不断下拉页面自己查找，十分浪费时间。
4、Bug可能成因：
- 可能是开发过程中对页面功能的疏漏，前端开发人员没有意识到社区页面需要实现对社区内容进行检索的功能。
5、改进措施
- 在前端页面为社区页面添加一个内容搜索框，并在后台为其编写对应的数据库操作语句即可。
Bug4：顶部搜索框出现不明意义的标签
1、Bug评级： 轻微错误（★）（对应产品外观缺陷）
2、可复现性：必然发生
3、Bug描述：
顶部搜索框右侧出现不明意义的ctrl和k的标签，一开始还以为是什么操作按键，之后才发现毫无用处。
4、Bug可能成因：
- 前端开发人员疏忽大意，开发过程没有将标签修改成需要的UI组件。产品审查人员也没有发现这一错误。
5、改进措施
- 前端开发人员将其修改成需要的
查询按钮即可。
Bug5："我的项目"页面的个人头像会随着页面滚动而滚动
1、Bug评级： 轻微错误（★）（对应产品外观缺陷）
2、可复现性：必然发生
3、Bug描述：
这是我的项目页面正常的样子：
随着页面下滑，头像会随着页面下滑而下滑：
4、Bug可能成因：
- 前端开发人员疏忽大意，产品审查人员也没有发现这一错误。
5、改进措施
- 前端开发人员将头像布局修改为
div块中的relative布局即可。
Bug6：页面放大后没有左右滚动条
1、Bug评级： 轻微错误（★）（对应产品外观缺陷）
2、可复现性：必然发生
3、Bug描述：
这是页面正常的样子：
这是页面放大后的样子：
可以看到有上下滚动条但是没有左右滚动条，因此看不到左右两侧的内容。经过测试后发现所有页面都是这样。
4、Bug可能成因：
- 前端开发人员疏忽大意，产品审查人员也没有发现这一错误。
5、改进措施
- 前端人员修改页面的布局方式。
1.1.7 结论
1.1.7.1 整体评分
软件评分细则参考了邹欣老师的：现代软件工程 团队作业 - 软件分析和用户需求调查。
| 类别 | 描述 | 评分 （满分 10 分, 良好 6 分, 及格 4 分，聊胜于无 1 分, 很差 -3 分） |
|---|---|---|
| 核心功能 | 分析三个核心功能，功能设计和质量。 | 7 |
| 细节 | 有什么为用户考虑的细节? | 7 |
| 用户体验 | 当用户完成功能时，不干扰用户 (例如: 是否不断弹出不相关广告)。 | 9 |
| 辅助功能 | 一些辅助功能如皮肤等 | 5 |
| 差异化功能 | 这个软件独特的功能. 它对用户的吸引力有多大? | 7 |
| 软件的效能 | 占用内存, 启动速度, 内存泄漏情况 | 8 |
| 软件的适应性 | 在联网/断网, 大小屏幕, 没有鼠标的情况下都可以顺畅操作. 和不同平台的软件能流畅协作 | 7 |
| 成长性 | 记住用户的选择, 适应用户的特点，用户越用越方便 | 8 |
| 用户有控制权 | 系统状态有反馈，等待时间要合适。关键操作有确认提示，有明确的错误信息。 让用户方便地从错误中恢复工作, 快捷操作键可调整。 | 7 |
| 在线编辑的便捷程度 | 是否支持多种编程语言，是否有语法、标识符提示等 | 8 |
| 总分 | 73 |
1.1.7.2 软件推荐度
根据总分参考前文的软件推荐度评级标准，给出推荐度：一般。
比较大的减分项：
- 缺少网站的使用说明
- 网站内容良莠不齐，实用性不高
- 模板和作品都没有对应的使用教程
1.2 IT屋（IT1352）
1.2.1 关于IT屋
IT屋（IT1352）是一个面向IT技术人员的中文技术交流社区。IT屋也提供了一些免费的在线工具和资源，例如代码编辑器、API文档、学习课程等，以方便用户进行学习和实践。
1.2.2 页面布局
一、首页
页面的整体布局采用了最经典的Header(导航栏）+Main（内容）+Footer（页脚）布局。页面的整体风格给人感觉简洁明了但稍显简陋，同时可能因为一行四个卡片的原因，给人感觉有些拥挤，页面的总体观感有点差强人意（但也许外表越是朴实无华，内里越是熠熠生辉呢）。
二、在线工具
页面的整体布局同样是Header(导航栏）+Main（内容）+Footer（页脚）布局。其中内容部分使用卡片的形式展示内容，并按照编译工具、数据工具、前端工具进行分类。同时可以发现页面有插入广告。
三、问答库
导航栏的问答库标签是一个下拉栏，根据不同的编程语言进行分类：
点击进入某一语言问答库（这里我选的是Java），可以看到整体页面还是比较简陋的，就是单纯的内容堆叠，也没有标签分类之类的功能：
四、菜鸟教程
与在线工具页面类似的布局，不再赘述：
1.2.3 功能体验
功能一：在线工具
这里我在在线工具页面选择了Java在线工具，进入Java在线编译器：
这里我写了一个Hello World！，点击运行后正常输出：
同时页面是支持直接在当前语言编译器直接切换到其他语言编译器的，对用户来说如果需要执行其他语言代码时可以直接切换而不需要回退到在线工具页面，还是比较方便的：
但是使用过程中也发现了一个很不友好的地方，就是广告实在太多了。一个页面居然有三个广告，而且都是大块大块的广告，看得很不舒服：
功能二：问答库
这里我打开了Java开发的问答页面，点击进入了一个帖子：
结果发现如果不关注公众号还无法查看全文，原本我还以为这是一个开放内容的平台，没想到还存在捆绑操作，极大地打击了我继续使用问答库这一功能的动力：
这里我被迫关注并得到了验证码，输入之后确实看到了文章的全部内容，但是这个登陆只能持续15天，15天后还要重新获取验证码，而且还不允许取关公众号，非常恶心人：
而且页面还是有着一样的问题，广告很多，甚至广告内容穿插在文章内容中:
此外我还发现一个问题，虽然这个板块叫做问答库，但是完全没有发帖提问的地方，甚至没有评论功能，整个问答库完全是由网站管理员发布的内容堆叠而成的，给我的感觉是，与其叫问答库，不如叫个人博客更合理一些。
然后我使用了一下导航栏的搜索功能，发现无法搜索出问答库中的帖子。比如我在Java问答库中搜索了已经存在的一个帖子，显示未找到相关资源。
我尝试了同语言的其他帖子以及不同语言的其他帖子，发现都无法搜索出来。这就意味着用户如果要找问答库中的某些内容，只能一页一页地翻，非常麻烦而且浪费时间。
功能三：菜鸟教程
首先看到的就是网站布局有点问题，中间空了一大块（大概率又是拿来放广告的 = =）。但是以功能性来说，教程类型是比较丰富的，涵盖了各种前端、后端、服务器、机器学习等等领域（甚至还有数字营销）：
这里我选择的是Java教程，整个教程的分类比较详尽，内容也写的比较详细：
但是广告还是一如既往地多，这次甚至在我点击下一节时会直接跳出广告页：
1.2.4 优缺点分析
-
优点
1、实用性功能较多。 网站的整体定位属于工具+教程的网站，提供了很多编程语言的在线编译工具和教程，对于编程小白来说是一款不错的学习网站。 -
缺点
1、广告太多。几乎所有页面都有插入广告，对用户来说体验很差。
2、页面设计比较简陋。 几乎所有页面都是相同的Header(导航栏）+Main（内容）+Footer（页脚）布局，一行四个卡片的布局让人感觉比较拥挤。
3、强迫用户进行捆绑操作。 需要关注公众号才能查看文章内容，而且不允许用户取消关注，如果长期使用需要不断获取验证码。
4、不支持用户交流。 问答库并没有体现问答的特性，用户无法发帖询问，也无法在已发布的帖子下回复。归根结底该网站没有用户注册和登录的操作，从这点上来说就已经很难实现问答效果。
1.2.5 改进意见
1、减少广告的出现频率。 广告可以有，但不应该太多。目前有时一个页面有三个广告而且占用页面大片区域，而且广告甚至穿插在文章内容中，这样的广告频率已经可以劝退绝大多数用户了。建议减少页面广告数量，缩小广告占用区域。
2、取消捆绑操作。 需要关注公众号才能查看网页内容的网页，注定走不长远，且容易被淘汰。这样的设置没有让用户感受到足够的真诚，反而感觉成为站主捞金的工具。可以为网站添加注册和登录功能来取代现在的方式，为已登录用户提供查看网页内容的设计还是可以接受的。
3、增强问答库板块的板块特性。 结合上述添加注册和登录功能的建议，可以为每个用户添加发帖功能和评论功能，这样更能体现问答板块应有的交流特性而不是像现在这样单纯是站主在自娱自乐，犹如一潭死水。
4、修改页面设计。 可以尝试修改一下页面布局方式和页面配色等等，提升用户观感。
1.2.6 Bug描述及分析
1.2.6.1 测试环境
操作系统：Windows 10 家庭中文版
浏览器：Google浏览器 版本 111.0.5563.147（64 位）
1.2.6.2 网页存在的Bug
Bug1：搜索框无法搜索网页的重要功能和内容
1、Bug评级： 一般错误（★★）（对应重要功能不实现）
2、可复现性：必然发生
3、Bug描述：
首先，IT屋这个网站最主要的功能就是在线编译器、菜鸟教程、以及问答库。搜索框应该是可以搜出这些内容的。
但是在我的测试下，我尝试搜索了Java在线工具、Java教程、以及问答库中已有的帖子，结果都是未找到相关资源。
Java在线工具：
Java教程：
问答库中已有的帖子：
在我进行了多轮的测试后，发现其他的工具、教程、帖子也是搜不出来的。
那它能搜出什么呢？只能搜出一些比较宽泛的内容，比如我搜索Java，就能搜出相应内容：
4、Bug可能成因：
- 后端的数据库查询语句没有实现对重要内容的查找，而且查询很奇怪，感觉毫无用处，除了一些宽泛的单词（如Java、python）才能出现搜索结果，搜索C、C++、C语言等都没有搜索结果。感觉后台的数据库查询语句根本就没有认真写。
5、改进措施
- 重写数据库查询语句，不要只能匹配一些简单的单词，最好能实现
在线编译器、菜鸟教程、以及问答库这三个重要功能的模糊匹配和完全匹配。
Bug2：问答库帖子的查看数为0
1、Bug评级： 轻微错误（★）（对应查询错误、数据错误显示）
2、可复现性：特定条件下发生 （帖子为在问答库前几页的帖子时发生）
3、Bug描述：
在Java问答库打开一个发布的帖子，可以查看数为0，刷新之后也还是0：
但是作为网页的浏览者我们已经查看了这个帖子，按照常理来说查看数应该时会增加的。
在我的测试下，发现问答库中前几页的帖子都有这种情况而在偏后页数的帖子则不会，下面是后几页的帖子：
4、Bug可能成因：
- 后端负责查看数增加的条件语句编写错误。 可能把查看数增加的条件写成了当管理员查看时才会增加查看数，导致用户查看时不会增加查看数。
5、改进措施
- 检查负责后端查看数增加的条件语句， 看看是不是条件语句写错了，如果不是条件语句写错了就有可能是数据库的问题了。
Bug3：页面布局失位
1、Bug评级： 轻微错误（★）（对应产品外形缺陷）
2、可复现性：必然发生
3、Bug描述：
在在线工具页面，滑到最底下发现最底下的三个卡片位置失位了：
4、Bug可能成因：
- 卡片的布局有问题，可能设置成居中显示了。
5、改进措施
- 修改一下卡片的布局即可。
1.2.7 结论
1.2.7.1 整体评分
| 类别 | 描述 | 评分 （满分 10 分, 良好 6 分, 及格 4 分，聊胜于无 1 分, 很差 -3 分） |
|---|---|---|
| 核心功能 | 分析三个核心功能，功能设计和质量。 | 6 |
| 细节 | 有什么为用户考虑的细节? | 5 |
| 用户体验 | 当用户完成功能时，不干扰用户 (例如: 是否不断弹出不相关广告)。 | 5 |
| 辅助功能 | 一些辅助功能如皮肤等 | 6 |
| 差异化功能 | 这个软件独特的功能. 它对用户的吸引力有多大? | 7 |
| 软件的效能 | 占用内存, 启动速度, 内存泄漏情况 | 8 |
| 软件的适应性 | 在联网/断网, 大小屏幕, 没有鼠标的情况下都可以顺畅操作. 和不同平台的软件能流畅协作 | 7 |
| 成长性 | 记住用户的选择, 适应用户的特点，用户越用越方便 | 6 |
| 用户有控制权 | 系统状态有反馈，等待时间要合适。关键操作有确认提示，有明确的错误信息。 让用户方便地从错误中恢复工作, 快捷操作键可调整。 | 6 |
| 在线编辑的便捷程度 | 是否支持多种编程语言，是否有语法、标识符提示等 | 9 |
| 总分 | 65 |
1.2.7.2 软件推荐度
根据总分参考前文的软件推荐度评级标准，给出推荐度：不推荐。
虽然说实用功能确实很多，但是瑜不掩瑕，如果只是奔着实用性，可以推荐这个网站。
比较大的减分项：
- 广告太多
- 没有用户注册、登录功能，无法实现用户交流
- 页面设计比较简陋
- 搜索框形同虚设
1.3 IDEONE
1.3.1 关于 IDEONE
IDEONE是一个在线编译器和调试工具，可以用60多种编程语言编译源代码并在线执行。
1.3.2 页面布局
该网站唯一的主要功能就是在线编译,可以看到整个页面还是比较简洁清晰的，虽然有广告但是不是很明显，还可以接受。除此之外就是不支持中文，浏览有点不方便。
1.3.3 功能体验
功能一：在线代码编译器
IDEONE支持多种编程语言的语言的在线编译，除了热门的编程语言之外也包含很多其他的编程语言。
这里我试着用Java在线编译器写了个hello world，除了速度比较慢之外都挺好的，页面看着也比较舒服：
这里我故意少打了一个分号，可以看到它给出的提示信息也很清楚：
功能二：查看历史代码
IDEONE支持查看用户之前运行的代码，但是需要用户注册并登录之后才能使用这个功能，同时又因为IDEONE是国外网站，注册需要下一个Gooreplacer插件才能进行人机验证，过程还是比较麻烦的。
在历史代码中，还可以记录与此代码相关的笔记，非常好用。
也可以设置代码的可见度，保护用户知识产权：
甚至可以根据代码的状态进行分类筛选，非常人性化：
功能三：代码范例
IDEONE中提供了很多语言的代码模板，用户可以download或fork模板进行学习：
这里我fork了一个Java代码，代码会在读到42之前不断打印数字：
可以看到是可以正常输出的：
功能四：近期代码
在近期代码页面可以看到近期所有用户的公开并成功运行的代码，这里可以供用户寻找灵感，进行学习。
但是在近期代码页面有几点个人感觉不足的地方：
- 第一：没有根据语言对代码进行分类的选项。 如果需要找专门一种语言的代码需要自行翻找。
- 第二：无法对他人的代码进行评论。 我们在查看别人代码时，可能会对他人的思路产生疑问，如果没有与代码作者交流的途径，可能会花费我们大量的思考时间。
1.3.4 优缺点分析
-
优点
1、麻雀虽小，五脏俱全。 作为一款轻量级的在线编译器网站，IDEONE在做好了自己的编译器功能之外，也实现了用户个人代码的简单管理和简单的代码交流学习功能。是一款不错的编程网站，适合刷leetcode、oj的新手小白使用。
2、支持几乎所有编程语言的在线编译。 IDEONE支持六十多种语言，几乎可以涵盖普通用户所有的编译任务，而不需要用户自己再进行繁琐的环境配置，对于编译一些简单的代码来说非常方便。 -
缺点
1、网页英文和繁体中文混杂。 IDEONE的语言系统比较混乱，很多页面都是同时存在英文和繁体中文，看着很奇怪。
2、国内注册需要自行导入谷歌插件。 在缺少谷歌插件Gooreplacer的情况下，注册时是无法进行人机验证的，而Gooreplacer需要自行到网上下载压缩包并导入到谷歌浏览器的插件中，整个过程虽然不会很麻烦但还是会劝退一些新手小白的。
3、缺少交流功能和检索功能。 IDEONE虽然可以通过查看别人的代码进行学习，但是无法与别人进行交流，当对他人的代码产生疑问时，只能独自思考。而且也没有对代码进行分类，查询起来比较麻烦。
1.3.5 改进意见
1、统一网站的语言。 最好全都改成简体中文。
2、推出国内版本。
3、为近期代码页面添加评论功能。
1.3.6 Bug描述及分析
1.3.6.1 测试环境
操作系统：Windows 10 家庭中文版
浏览器：Google浏览器 版本 111.0.5563.147（64 位）
1.3.6.2 网页存在的Bug
Bug1：页面语言混乱
1、Bug评级： 轻微错误（★）（对应产品外观缺陷）
2、可复现性：必然发生
3、Bug描述：
在很多地方都同时存在英文和繁体中文，给人的观感很奇怪：
4、Bug可能成因：
- 编写网站的前端人员来自不同的国家，没有统一网站使用的语言。
5、改进措施：
- 统一语言即可。
1.3.7 结论
1.3.7.1 整体评分
| 类别 | 描述 | 评分 （满分 10 分, 良好 6 分, 及格 4 分，聊胜于无 1 分, 很差 -3 分） |
|---|---|---|
| 核心功能 | 分析三个核心功能，功能设计和质量。 | 8 |
| 细节 | 有什么为用户考虑的细节? | 8 |
| 用户体验 | 当用户完成功能时，不干扰用户 (例如: 是否不断弹出不相关广告)。 | 8 |
| 辅助功能 | 一些辅助功能如皮肤等 | 7 |
| 差异化功能 | 这个软件独特的功能. 它对用户的吸引力有多大? | 8 |
| 软件的效能 | 占用内存, 启动速度, 内存泄漏情况 | 8 |
| 软件的适应性 | 在联网/断网, 大小屏幕, 没有鼠标的情况下都可以顺畅操作. 和不同平台的软件能流畅协作 | 7 |
| 成长性 | 记住用户的选择, 适应用户的特点，用户越用越方便 | 6 |
| 用户有控制权 | 系统状态有反馈，等待时间要合适。关键操作有确认提示，有明确的错误信息。 让用户方便地从错误中恢复工作, 快捷操作键可调整。 | 8 |
| 在线编辑的便捷程度 | 是否支持多种编程语言，是否有语法、标识符提示等 | 9 |
| 总分 | 70 |
1.3.7.2 软件推荐度
根据总分参考前文的软件推荐度评级标准，给出推荐度：一般。
比较大的减分项：
- 注册需要导入插件，比较麻烦
- 无法实现用户交流
- 不支持简体中文，不方便用户浏览
- 没有搜索功能
1.4 采访截图
本次采访对象是我的高中同学陈成志，就读于东南大学计算机科学与技术专业。下面是采访的聊天截图：
2、产品分析
2.1 开发时间估计
2.1.1 团队成员情况
6名计算机相关专业的本科毕业生。学习过Vue框架、Springboot框架、数据库原理、软件工程等专业课程。
2.1.2 产品功能分析
结合上述三款在线编程网站的测评经验，吸取其各自的优点和经验教训，我总结出一款优秀的在线编程网站应该具有的功能和应该注意的设计细节如下：
应该具备的功能：
- 用户的注册与登录
- 集成
多种编程语言的在线编译器 - 支持用户的项目管理
- 支持用户间的交流学习。具体表现在
用户社区、支持用户发布自己的项目、支持评论其他用户的作品和支持用户间私信。
应该注意的设计细节：
- 网页的页面设计一定要
简约清晰，不要插入过多的广告。 - 为网站编写
使用说明书，对于网站用户发布的个人项目要求其配备项目的使用说明书，以防其他用户不知道如何使用别人的项目。 - 搜索框一定
要做好，要做的有效，支持搜索网站的大部分内容。不要明明是网站中有的内容却搜索不出来。 - 用户社区一定要做好
社区化的分类，具体可以实现为为每个编程语言划分一个社区。 - 项目类型也要做好分类，方便用户检索。
2.1.3 可能遇到的困难
-
大量数据的存储：本科生在校期间的数据存储量级都很小，mysql足以应付，但是对于大型网站的数据，数据的量级可能呈指数级增长，如何解决庞大数据量的存储问题将成为一个难题。
-
高并发：需要考虑到大型的网站的访问流量较大，如果服务器应对不了这样的压力就会崩溃。
-
搜索算法的实现： 如何在大量数据的背景下实现快速准确地搜索内容也是一个难题。
2.1.4 项目进度耗时分析
依照软件工程课程的学习成果，拟采用瀑布模型进行开发，具体进度耗时分析如下：
| 项目进度 | 所需时间 |
|---|---|
| 需求分析 | 10天 |
| 原型设计 | 10天 |
| 后端数据库设计 | 20天 |
| 前端网页设计 | 20天 |
| 对前端页面进行数据渲染的代码编写 | 30天 |
| 前端组件对接后端代码 | 30天 |
| 网站嵌入在线编译器 | 30天 |
| 网站测试 | 20天 |
| 网站部署服务器 | 10天 |
| 总计 | 180天 |
预计开发一款优秀的在线编程网站至少需要6个月的时间。
2.1.5 三款网站的开发时间估计
在此基础上估计：
- 开发
InsCode预计需要8个月 - 开发
IT屋预计需要6个月 - 开发
IDEONE预计需要6个月
2.2 三款网站在同类型网站中的排名及其自身优劣总结
2.2.1 其他在线编译器网站
做得比较不错的在线编译器网站还有codepad、comeaucomputing等等，这里给出这些网站的简要介绍：
-
codepad
codepad是一个提供在线编译/调试工具的网站，你可以将代码复制到这里，然后提交运行，就会生成一个URL连接，将此URL连接通过邮件发送至你的好友来求助。codepad还提供移动设备版，让你可以随时分享代码。
-
comeaucomputing
一个测试驱动的C/C++在线编译器。
2.2.2 五款在线编译网站的优劣总结
| 编译网站 | 优点 | 缺点 |
|---|---|---|
| InsCode | 1、页面风格简洁清晰。 InsCode没有插入广告，给人的整体感受比较高级舒适。2、功能多样。 InsCode除了主要的代码在线编辑功能外，还支持与Gitcode关联进行 项目管理，而且还支持社区交流，可以查看、fork其他用户的项目进行学习。3、丰富的模板资源。 InsCode的模板中心包含多个应用领域的模板，如 AI应用、网页设计、游戏创作、图形编辑等方面的模板。4、支持多种编程语言。 InsCode 支持多种编程语言，包括Java、C++、Python等，覆盖了大部分的开发语言，无需进行繁琐的安装和环境配置。 | 1、缺少网站的入门教程，对于已发布的作品或模板也没有相关的使用说明。 使用一个比较陌生的模板时，完全不知道如何下手，甚至对于熟悉的模板，也会因为不熟悉在线编辑器的使用方法出现无法理解的错误。 2、部分功能不完善。 比如在 我的项目中发布项目会出现不明原因的参数错误；社区页面并没有体现出社区该有的特性（如社区划分等）。 3、页面UI设计不合理。 比如在 社区页面中没有搜索框，导致用户需要查询某些资源是需要不断下拉页面自己查找，十分浪费时间。 |
| IT屋 | 1、实用性功能较多。 网站的整体定位属于工具+教程的网站，提供了很多编程语言的在线编译工具和教程，对于编程小白来说是一款不错的学习网站。 | 1、广告太多。 几乎所有页面都有插入广告，对用户来说体验很差。2、页面设计比较简陋。 几乎所有页面都是相同的 Header(导航栏）+Main（内容）+Footer（页脚）布局，一行四个卡片的布局让人感觉比较拥挤。3、强迫用户进行捆绑操作。 需要关注公众号才能查看文章内容，而且不允许用户取消关注，如果长期使用需要不断获取验证码。 4、不支持用户交流。 问答库并 没有体现问答的特性，用户无法发帖询问，也无法在已发布的帖子下回复。归根结底该网站没有用户注册和登录的操作，从这点上来说就已经很难实现问答效果。 |
| IDEONE | 1、麻雀虽小，五脏俱全。 作为一款轻量级的在线编译器网站，IDEONE在做好了自己的编译器功能之外，也实现了用户个人代码的简单管理和简单的代码交流学习功能。是一款不错的编程网站，适合刷leetcode、oj的新手小白使用。2、支持几乎所有编程语言的在线编译。 IDEONE支持六十多种语言，几乎可以涵盖普通用户所有的编译任务，而不需要用户自己再进行繁琐的环境配置，对于编译一些简单的代码来说非常方便。 | 1、网页英文和繁体中文混杂。 IDEONE的语言系统比较混乱，很多页面都是同时存在英文和繁体中文，看着很奇怪。 2、国内注册需要自行导入谷歌插件。 在缺少谷歌插件 Gooreplacer的情况下，注册时是无法进行人机验证的，而Gooreplacer需要自行到网上下载压缩包并导入到谷歌浏览器的插件中，整个过程虽然不会很麻烦但还是会劝退一些新手小白的。3、缺少交流功能和检索功能。 IDEONE虽然可以通过查看别人的代码进行学习，但是无法与别人进行交流，当对他人的代码产生疑问时，只能独自思考。而且也没有对代码进行分类，查询起来比较麻烦。 |
| codepad | 网页界面简洁，一目了然，适合手机浏览器。且支持C,C++,D,PHP,PYTHON,Perl,Ruby等十几种编程语言，非常强大。查看执行结果时，高亮显示代码。 | 1、需要挂VPN才能访问。 2、有时点击提交按钮后，给出一个出错页面，需多次提交才给出结果。另外不具有交互性，且不提供编译后的可执行文件。 |
| comeaucomputing | 编译器的版本比较丰富 | 页面文字较多，不适合手机浏览，且编译后显示结果不明了，反正我最简单的"Hello World"程序好像都通不过。 |
2.2.3 五款网站的排名
根据上述五款网站的优缺点，给出排名 （仅代表个人意见）：
1、IDEONE（页面非常简洁，而且支持非常多的编程语言，在做好了在线编译的本职之外还能够支持各种编程语言的模板，还能查看别人的代码，很加分）
2、InsCode（虽说现在的功能差强人意，但是InsCode算是开创了代码在线编辑的一种新的途径，它能够支持大型项目的在线编译和项目管理，也可以fork别人的项目进行学习，未来可期）
3、Codepad(虽然也是一款很好用的在线编译工具，但是支持的编程语言不如IDEONE丰富，也没有IDEONE的扩展功能）
4、IT屋（虽说实用性工具也比较丰富，而且还有各种教程，但是广告太多，而且还捆绑用户必须关注公众号大大扣分）
5、comeaucomputing（算是比较古老的在线编译工具了，只支持C/C++)
2.3 给评测的三款网站的软件工程方面的建议
其实在第一部分有给出三款网站的改进意见，在此再次总结如下：
| 网站 | 建议 |
|---|---|
| InsCode | 1、可以尝试像GitCode一样写一份网站使用说明，为网站的新用户提供一份入门教程。同时可以在创作者发布作品时添加一个项目说明书选项，引导创作者为自己的项目添加使用教程，方便其他用户了解模板的使用方法。2、建议加强对应页面的功能性。比如在项目管理中却无法发布项目，应该算是一个比较大的 bug了；社区页面建议可以为不同语言或不同应用领域的项目单独划分一个社区，方便对应社区的用户交流。3、添加一些便于用户与页面交互的 UI组件，比如为社区内容添加一个搜索框。 |
| IT屋 | 1、减少广告的出现频率。 广告可以有，但不应该太多。目前有时一个页面有三个广告而且占用页面大片区域，而且广告甚至穿插在文章内容中，这样的广告频率已经可以劝退绝大多数用户了。建议减少页面广告数量，缩小广告占用区域。 2、取消捆绑操作。 需要关注公众号才能查看网页内容的网页，注定走不长远，且容易被淘汰。这样的设置没有让用户感受到足够的真诚，反而感觉成为站主捞金的工具。可以为网站 添加注册和登录功能来取代现在的方式，为已登录用户提供查看网页内容的设计还是可以接受的。3、增强问答库板块的板块特性。 结合上述 添加注册和登录功能的建议，可以为每个用户添加发帖功能和评论功能，这样更能体现问答板块应有的交流特性而不是像现在这样单纯是站主在自娱自乐，犹如一潭死水。4、修改页面设计。 可以尝试修改一下 页面布局方式和页面配色等等，提升用户观感。 |
| IDEONE | 1、统一网站的语言。 2、推出国内版本。 3、为近期代码页面添加评论功能。 |
2.4 Bug出现原因及分析
第一部分已经提及，这里不再赘述，查看细节请返回目录导航。
3、市场分析及项目规划
3.1 市场概况
在线编译器是一种基于互联网的编译器，它提供了一个在线平台，让开发人员可以直接在网页上编写和运行代码，而不需要安装本地开发环境。在线编译器产品在软件开发领域有着广泛的应用，尤其是在学生、初学者和远程工作的开发团队中非常受欢迎。
3.2 市场规模
在线编译器主要受众人群包括IT从业者、IT专业学生以及IT科研人员.而截止2020年我国程序员总数超过600万，2022年的IT专业学生也达到了100多万。而2023年保守估计在线编译器的直接用户人数达到至少800万。
而潜在用户的来源可能包含：对IT技术有兴趣的人群和将来有可能踏入IT行业的人群。
有可能踏入IT行业的人群很大一部分来源于考研跨考IT相关专业的人群和未来准备报考IT相关专业的高中生，可以通过跨考人数和高考填报IT志愿的比例进行分析，预估潜在用户至少400万。
3.3 市场现状
3.3.1 市场竞争
在线编译器市场竞争激烈，有许多大公司和创业公司在这个领域竞争。一些主要的在线编译器产品包括：Codepen、JSFiddle、Repl.it、CodeSandbox、Stackblitz等。这些产品在功能、易用性和性能方面有所不同。在第二部分已经对InsCode、IT屋、IDEONE、Codepad、comeaucomputing这五款在线编译器的优劣进行过分析，具体细节请看上文。
3.3.2 市场趋势
在线编译器市场规模庞大，预计在未来几年内将继续增长。根据市场研究公司Technavio的报告，全球在线编译器市场在2019年至2023年间的复合年增长率预计为17％。
- 云计算的普及： 随着云计算技术的普及，越来越多的公司和个人将转向使用在线编译器，以便更加高效地开发和测试代码。
- 远程工作的兴起： 在远程工作模式下，许多开发人员需要使用在线编译器来协作开发代码。
- 开源社区的贡献： 开源社区中的许多项目都提供了在线编译器，以方便开发人员进行贡献和测试。
3.3.3 市场机会
除了在第二部分提到的一款优秀的在线编程网站应该具有的功能和应该注意的设计细节之外 （具体见上文） ， 随着在线编译器市场的不断发展，许多机会涌现出来。一些机会包括：
- 改进性能和稳定性： 在线编译器需要优化其性能和稳定性，以提供更好的开发体验和用户满意度。
- 增强协作功能： 许多开发人员需要使用在线编译器进行协作开发。因此，增强协作功能是在线编译器的一个重要机会。
- 扩大应用场景： 在线编译器可以用于许多不同的应用场景，如教育、游戏开发、数据科学等。因此，在线编译器可以通过不断扩大应用场景来获得更多的机会。
3.4 市场与产品生态
3.4.1 产品特点及创新点
- 产品特点
1、在线编写和运行代码： 用户可以在网站上编写代码并直接运行，无需下载安装任何软件。
2、支持多种编程语言： 在线编译网站支持多种编程语言，包括Java、Python、C++等。
3、可以调试代码： 用户可以通过在线编译网站来调试自己的代码，找到代码中的错误和bug。
4、高效性和可扩展性： 在线编译网站可以提供高效的编译服务，并具备很好的可扩展性，可以满足不同用户的需求。
- 2、创新点
1、支持用户的项目管理
2、支持用户间的交流学习。 具体表现在用户社区、支持用户发布自己的项目、支持评论其他用户的作品和支持用户间私信。
3.4.2 产品用户画像刻画
Q： 这个产品的核心用户群是什么样的人？典型用户是什么样的？学历，年龄，专业，爱好，收入，表面需求，潜在需求都是什么？
A： 根据产品的两大类直接受众IT从业者和IT相关专业学生进行刻画，这两类用户都可以选择使用我们的产品：
IT从业者黄先生：
| 刻画指标 | 指标描述 |
|---|---|
| 学历 | 硕士 |
| 年龄 | 28 |
| 专业 | 计算机科学与技术 |
| 爱好 | 写代码 |
| 特点 | 钻研自身工作，渴望提升自我 |
| 收入 | 15~20k每月 |
| 现状 | 工作中需要安装各种语言环境配置 |
| 表面需求 | 解决工作中遇到的问题 |
| 潜在需求 | 渴望一款支持多语言的在线编译网站，无需进行繁琐的环境配置即可编译项目，同时支持项目管理 |
IT相关专业学生小张：
| 刻画指标 | 指标描述 |
|---|---|
| 学历 | 本科在读（大一） |
| 年龄 | 19 |
| 专业 | 软件工程 |
| 爱好 | 写代码 |
| 特点 | 勤学好问 |
| 收入 | 无收入 |
| 现状 | 刚刚开始接触编程，正在学习C/C++，并在OJ和LeetCode上刷题 |
| 表面需求 | 提出自身疑问，获得在技术层面的解决方案 |
| 潜在需求 | 渴望有一款在线编译网站，不仅支持多语言的程序编译，而且还有各种语言的入门教程，同时希望这个网站能够发布帖子寻求大佬帮助解决自己的问题 |
3.5 产品开发规划
3.5.1 产品NABCD分析
在这里对InsCode进行拓展，可以通过添加网站使用说明和添加各模板使用教程的方法来提高网站的竞争力，NABCD分析如下：
| 关键点 | 分析 |
|---|---|
| N（Need，需求） | 在测评InsCode时，我就遇到了因为不懂如何使用Java模板而放弃的情况，而且在很多模板下面都有用户评论不知道如何使用模板或出现未知错误，所以添加这个功能是有实际需求的。 |
| A（Approach，方法） | 添加网站使用说明和添加各模板使用教程。官方在页面底部放置网站的使用说明链接（参考GitCode）。对于用户发布的模板，可以在用户发布模板时，要求用户发布模板教程。 |
| B（Benefit，好处） | 通过添加这个功能，不仅可以提升现有用户的体验，也可以吸引一些基础薄弱的小白进站学习。用户的体验提升之后，就会成为网站宣传的中介，吸引更多的人成为该网站的用户 |
| C（Competiton，竞争） | 在现有的在线编译网站中，没有像InsCode这样社交交流性质很强的网站，也没有InsCode这样支持项目管理的网站。同类竞争的压力几乎为0。如果能把项目交流的细节做好，InsCode未来的发展前景是很广阔的。 |
| D（Delivery，推广） | InsCode作为CSDN的子产品，可以借助CSDN的影响力进行推广，而体验感良好的用户也可以成为网站宣传的中介。 |
3.5.2 产品开发规划
计划在6人团队中，1人负责美工，2人前端，2人负责后端，剩下1人进行产品规划，指导项目推进、质量把控，以及最后的测试工作。
16周开发计划如下：
| 周数 | 进度概述 | 进度详情 |
|---|---|---|
| 第1-2周 | 需求收集和分析 | 1、确定要实现的功能和特性 2、确定用户界面设计和用户体验要求 3、确定系统架构和技术栈 4、制定产品规格说明书 |
| 第3-4周 | 前端开发 | 1、开发用户界面，实现产品设计 2、开发用户体验功能 3、集成必要的第三方库和工具 |
| 第5-6周 | 后端开发 | 1、设计并实现RESTful API 2、开发数据存储和管理功能 3、集成必要的第三方库和工具 |
| 第7周 | 测试和修复漏洞 | 1、进行单元测试和集成测试 2、找出并修复代码漏洞和缺陷 3、确保网站能够稳定运行 |
| 第8周 | 发布第一个版本 | 1、确定功能上线日期和发布计划 2、将开发环境迁移到生产环境 3、部署并发布第一个版本 |
| 第9-12周 | 增加更多功能 | 1、增加更多功能和特性，如文件上传、版本控制和代码审查 2、优化用户体验和性能 3、修复漏洞和缺陷 |
| 第13-14周 | 个人项目管理 | 1、开发个人项目管理功能，如任务列表、日历和提醒 2、实现用户身份验证和授权 3、集成必要的第三方库和工具 |
| 第15周 | 测试和修复漏洞 | 1、进行单元测试和集成测试 2、找出并修复代码漏洞和缺陷 3、确保网站能够稳定运行 |
| 第16周 | 发布最终版本 | 1、确定功能上线日期和发布计划 2、将开发环境迁移到生产环境 3、部署并发布最终版本 |
扫一扫
1625
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
