网页游戏开发平台(在线编程教育平台分析：编程猫)

导言：儿童编程教育是通过编程游戏启蒙、视觉图形编程等课程，培养学生计算思维和创新问题解决能力的课程。基于经验编程猫分析的目的是快速理解编程猫的产品。分析的重点是编程cat网络版-创意社区。网络版包括编辑使用、课程设置、作品创作与发布、源代码向导、库、论坛等主要版块，屏幕大且易于操作。从体验出发，分析该产品某些功能设计的目的，用户体验如何，是否有更好的方案。

1.市场概况

随着计算机网络的不断发展，国家越来越重视青少年程序设计教育。随着steam教育的实施，儿童节目越来越受欢迎。让孩子们在家里和网上接受有趣的科学和创新教育。拓展儿童的思维和创造力已成为当今时代最热门的话题之一。

于是，3-18岁的在线编程教育竞争市场开始形成并扩大。目前，市场上的少儿节目教育产品包括节目猫、核桃节目、小码王、傲梦节目、XRS、贝尔节目、猿类节目、玩中学等，各大企业已开始抢占市场，但没有独角兽企业，所以这个巨大蛋糕仍然有无线分发的可能性。

2.数据分析

1）趋势研究

从近几个月来儿童编程软件的搜索指数来看，XRS、programmingcat和walnutprogramming的搜索量位列前三（其中XRS不仅包括儿童编程，而且ape编程与傲梦编程类似）。

数据来源：百度索引

2）人群肖像

根据人群的肖像，获得以下排名。在每个主要的年轻阶段，每个年轻级别的人都有不同的偏好。目前，社会经济主要由20-49岁的年龄水平驱动，因此不分线上和线下。最赚钱的软件是胡桃木编程、cat编程、小码王编程和傲梦编程。

数据来源：百度索引

小结：从目前的数据可以看出，编程猫的搜索量和所有年龄层的选择程度都不是最优的。

1.移动终端功能架构图

2.web端功能架构图

3.客户端功能架构

总结：

1. 页面介绍：编程猫有两个官方网站，一个是社区（shequ.Codemao.CN），另一个是官方网站（Codemao.CN）。社区官方网站功能丰富、全面。在编程猫的移动终端和网络终端中，所有成员都可以随时浏览热门、新手等开发和制作作品。客户端包括类的客户端和编辑器。用户可以根据需要选择相应的软件。
2. 课程和创建：编程猫提供大量模板、免费公共课程、免费教程和材料。课程有很多种类和选择。创作分为自由创作、边看边学和使用模板。
3. 课程体验：现有教学课程采用卡通动画讲解的形式，更贴近儿童，教学内容更容易被吸收。
4. 班级注册：你喜欢编程猫通过填写手机号码预约的方式吗？

1.编程猫社区主页

在编程猫社区的主页上，你可以看到有许多免费视频需要学习。这些教程通过编程猫和源码君之间的对话介绍动画制作，并通过将每行代码转换为构建块来学习编程。对于青少年来说，它生动、有趣且易于使用。

主页分类包括：创作简介（视频教学）、创作体验（创意教学）、精选猫（精选教学）、新作喵喵、CJP工作室、原创儿童小说、节目电视（嵌入b端视频）、社区明星推荐（优秀创作者）。其中，点击【点击猫选】、【新作品喵喵视图】、【CJP工作室】和【社区明星推荐】时，当前窗口将打开一个新页面。

导航栏包括：课程、探索、工作室、论坛、材料、活动、应用程序下载二维码和创意社区。横幅右侧的主要促销产品可以直接使用。我们知道编程猫开发了自己的编程语言Kitten。

停留划痕在儿童编程的基础上，简化了编程步骤，比从头开始更容易使用。从主页上滑下的列表是教程的分类：介绍、创意、选择等。可以说对平台用户非常友好。这让我觉得我真的很想让孩子们体验自由快乐的学习和创新。

产品的关键功能尽可能多地反映在主页上。图案布局清晰。所有物品均为方形，带有圆角。所有的图片都是卡通图片。无论布局如何变化，整体风格统一而不突兀。

就创意体验而言，产品的出发点是让每个人都看到创意作品并渴望尝试吗？用户单击左侧的视频分类封面图像->；右侧的演示动画、作品信息和作者信息将相应切换。

但[体验创造力]按钮保持不变。用户点击动画区域的效果与右下角的[体验创意]=>；教学视频窗口弹出。因此，这意味着体验创意是体验视频，而不是用户。把它放在用户信息的底部是不合适的吗？

解决方案：我认为它可以放在视频名称后面，或者当鼠标移动到动画区域时，会显示[体验创意]按钮。如果取消该按钮，是否可以将右侧用户信息栏的区域移动到动画显示。

2.Kitten的源代码编程是边看边写的

单击顶部导航[课程]切换到教程页面。包括：源代码教程，3D编程课程python编程课、移动终端编程课和儿童编程课。默认的第一个选项是“源代码编程课程”。

选择要学习的教程，将弹出教学视频窗口。点击右下角的[dowhilewatching]进入“newsourcecodeeditor”（新源代码编辑器）页面（这也是社区主页右侧创建下的第一个按钮。sourcecodeeditor4.0。为了方便用户使用，产品将旧源代码编辑器保留为第二个按钮）。

在编辑器页面中：左侧的动画演示区域约占25%，用于演示和手动拖动、缩放和移动角色。最小化角色添加区域和构建块区域的比例。积木操作区域约占64%，积木大小可通过右下角缩放。

教学视频播放区域的最小尺寸可以减小到489*315。单击最小化按钮，视频将作为右侧的视频播放按钮隐藏。

角色操作区：点击角色右侧的三角形按钮，侧面会弹出角色放大的角色操作页面。操作页面覆盖整个构建块区域。再次单击三角形按钮以隐藏角色操作页面。

构建块选择区域：单击按钮，右键滑出详细的按钮选择列表，然后下拉以查看更多信息。单击按钮将其添加到该区域，或直接将其拖动到操作区域，以向演示区域中的角色添加事件、动画、音乐和其他效果。每个按钮左上角的圆圈是一个事件：即当触发条件时，需要执行什么样的操作。这些操作按钮通过吸附在事件下方而生效。

构建块操作区域可以在整个屏幕范围内左右拖动，这意味着操作区域的大小就是整个屏幕区域。当用户希望水平排列一个操作时，会有更多区域。

添加角色

积木动画

地区比例合理吗？为什么设置成这样？有更好的解决方案吗？

我个人认为这不合理。众所周知，大多数软件按钮都安排在两侧，这是用户的习惯。例如PS、axture、Visio、vscode等软件和编程猫移动终端。显示区（即此处的动画演示区）所占比例最大，因为这是用户希望看到的最终结果。如果是编程软件，则编程区域最大。作业面积所占比例第二。

为什么要这样设置？以下是我的猜测。

• 为了让孩子们在观看视频的同时更好地操作，操作区所占比例最大。
• 由于积木可以自由移动，需要更复杂的动画，因此需要调用更多的积木，因此操作区域所占比例最大。
• 设计师将示范区（示范区+角色区）和操作区（操作区+积木）分为两部分。在操作区，构建块位于左侧，操作区相当于“编程区”。如果有两个区域，我们可以通过背景色来区分它们吗？

关于构建块操作区的全屏便携性：我认为这是一个非常友好的操作。然而，当鼠标点击积木操作区域时，它仍然是箭头形状，因为根据用户习惯，可移动的标志是抓取形状（通常是空格键+鼠标）。这意味着许多人不知道如何移动。而直接点击移动，鼠标不能总是按移动来达到全选的效果。只能删除一组构建块。

角色操作区域中的三角形按钮：单击展开和隐藏的三角形按钮。它们能变得不同吗？

3.3D编程代码岛学习

CodeIsland3.0是一个独立的产品。编程猫和代码岛的成员是独立的，需要重新注册。代码岛播放器需要有编程基础。如果他们使用代码岛制作地图，他们需要回到系统提出的问题。这也是为高质量的用户和作品输出的代码岛。稍后更新此部分。

4.Python编程学习

Python是世界上最好的语言！哈哈，开玩笑而已。任何学过编程的人都知道开发分为前端和后台。Python属于后台开源语言。我们可以用代码做很多事情，把想法变成现实。直狐、豆瓣和Youtube都是基于python开发的。

编程猫的海龟编辑器是Python的学习天堂。它还分为构建块模式和代码模式，以满足不同阶段、不同习惯和不同需求的培训师。

界面导航栏包括：返回主页、文件操作、保存和修改、搜索、模式切换（默认构建块模式）、语言切换（默认简体中文）、帮助、个人中心，并单击最右侧显示区域上的三角形按钮。最左边是操作栏，后面是最大区域的代码编程区域，左边和右边是终端区域和正在运行的动画窗口。这是目前主流编程软件的布局。

此外，该产品在代码编程区域的右上角小心地添加了日间/夜间模式切换。切换到夜间模式后，单击以切换构建块模式。积木模式没有夜间模式。

在turtle编辑器中，有两种方法可以删除代码：

1. 代码模式：用退格键删除，长按全部删除；
2. 构建块模式：用鼠标长按构建块并将其拖动到删除栏。这里删除构建块的方式不同于源代码编辑器和移动终端中的方式。

对于不理解代码的新手用户或不知道如何启动的用户，文件中提供了模板工作按钮。单击模板，将显示相应的代码或构建块。模板工作中详细说明了工作的内容和难度。

将模板工作放入文件中是否合理？为什么设置成这样？

我个人认为这不合理。许多旁观者对这些作品有强烈的好奇心。如果一个不懂代码的人进入turtle编辑器，除了切换视频学习窗口，他还可以通过什么方式自己玩？CAT提供了另一种学习编程模板的方法。只需单击模板即可获得相应的代码和构建块。为什么要在文件中隐藏这么好的函数？

为什么要这样设置？以下是我的猜测。

• 为了让孩子们不抄袭自主性学习，然后创造一种他们已经学会的错觉。
• 模板工作是一个不成熟的需求，家长对此有不同的看法。

两位编辑的比较：

5.回答问题

源代码向导是通过游戏学习代码。网络和移动终端都包含了这个项目，它也有相应的小程序。男性孩子会喜欢的。在源向导中，用户成为训练师，解锁和培养不同类型的精灵以获得奖励。

在官方网站的主页上，单击导航栏[发现]，源向导是发现页面中主要的快速导航之一。

左上角的个人信息；右侧功能：商店、交友、车间、spirit和atlas；右下角有两个按钮：回答和探索。培训师通过回答问题获得能量石，并通过能量石孵化鸡蛋。

答案类别：尼摩每日问题（21级）、Kitten每日问题（11级）、python每日问题（11级）和有趣的每日问题（11级）。每种类型的问题每天都有一个免费答案。

在Nemo的回答中，每层需要正确回答5个问题，编程猫将向上移动一层并获得该层给予的奖励。如果当前的五个问题没有完全正确回答，那么正确答案的数量+接下来五个问题中正确答案的数量，直到它大于或等于五个问题，编程猫可以向上移动一层，超出正确答案的值将包含在下一层的正确值中。

提交每个问题的答案后，您可以查看结果并获得分析内容。在每一轮的答案结果页面上，您仍然可以单击[分析]查看每个问题的分析。如果你中途放弃，答案的数量将被扣除，你将无法获得经验。

从回答经验来看。后台系统建立一个题库，输入问题、答案选项、正确答案和分析。单击开始回答时，调用问题库界面。系统会在题库中随机显示问题。当答案与系统答案一致时，它将不再显示。如果答案与系统答案不一致，请将其放回题库。在回答问题的过程中，错误的问题会出现在随后的楼层，因此这些问题不会被评分。

在回答页面中，每个问题基本上都有一张图片，占了很大比例。选项需要滑动才能看到完整。

我意识到爬楼的困难。。。但丰厚的奖励可以刺激用户回答问题和学习。

提高论坛的讨论度，那么为什么每一轮答案集的价值和通过前一个5级的价值？为什么楼层大于10层？这意味着对于每种类型的问题，你需要回答至少55个问题才能获得完整的奖励。每个问题的速度是30秒。爬上这栋楼至少需要28分钟。

使用答题纸后，您能否在提示中添加一个进入课堂/参与活动的按钮？

1.优势

在编程猫的移动终端和网络终端上，家长和孩子（用户）可以直观地看到一些作品，公开讨论和免费学习，学习内容可以及时分享和反馈。对于像我这样懂编程的人，我想我可以从中学到很多东西，认识更多伟大的神和有趣的朋友。

编程cat为用户提供网页客户端、手机客户端、类客户端和编辑客户端。

我相信编程猫的产品经理一定是一个细心、可爱、怀旧的人。很多细节对我的朋友都很体贴。例如，网站编辑器中设置的昼夜模式、大量免费公共课程、从有趣的动画中引入教程内容、在编辑器中添加视频播放区域、提供和使用大量免费材料、模仿工作模板等。

2.冷静点

点击边看边学按钮，点击进入编辑编辑页面。视频同步在屏幕的右上角。你可以随意放大、缩小和拖动。新版本和旧版本的编辑器同时存在，Python的构建块模式和代码模式切换，提高了用户的选择自由度。

右上角的圆形标记将事件和动作区分开来。

3.缺点

当然，还有很多不足之处。除了文章中提到的，你还可以在appstore中发现许多不足之处。最大的反应是：用户的工作缺失、云存储问题、内容推送算法不够全面等等，这些都是非常致命的漏洞，对用户来说是不友好的体验。

进入自由创建页面并将其保存在草稿框中，无需单击任何内容。你对强迫症感到不舒服吗？能否添加一个弹出窗口，询问是否加入草稿框？

对于Kitten未来的发展，很多家长和孩子都有竞争心理。当父母为他们的孩子申请课程时，他们想获得一个奖项，这对父母和孩子来说是一个巨大的鼓励。Scratch有自己的竞争对手和奖杯。Kitten也能创造一些竞赛活动吗？

我还没有足够的经验，我会继续关注。目前，我们还需要深入体验编程猫的在线课程、动画创作、应用端、客户端和重要竞争产品分析。

后续更新~

本文最初由@Mindy发表。每个人都是产品经理。未经作者许可，禁止转载。

题图来自unsplash，基于cc0协议