CIRCLE & IDEA
项目信息
如果你对该项目感兴趣,请阅读 如何加入项目 ,在 WIKI 页面下留言,直接在 Github 提交 Pull Request 或者阅读下方该项目的参与备注。
项目阶段 | 项目人员 | 项目参与备注 |
|
|
|
产品和设计阶段
手绘原型稿 #1
- 作者: @dimpurr
- 时间: 201711 / 201804
BYRCIRCLE 前身是 @dimpurr 于 201503 提出的设想:「Dircle · 一个快速个人页和圈子友链管理系统」。 原因是自己个人博客上的友链过多过长不便管理和展示,曾和 @dring 有过一系列讨论和绘制纸上原型 (然而高中根本没时间写) 。 201711 和 @heymind 讨论过后绘制了一版原型,并尝试开发 (了名为 DircleFeed 的链接和RSS聚合子项目) 。 201804 修改定位并转入 BYRIOSC 子项目,正式启动开发。
产品设计#1
- 作者: @dimpurr
- 时间: 201804
简介
BYRCIRCLE & BYRIDEA 创意社交网络 · 便捷的个人页和圈子、技能点和项目意愿标记、 IDEA 发布和组队平台。
BYRCIRCLE & BYRIDEA 共同构成一个技能和创意社交网络。 BYRCRICLE 能快速创建美观的个人页,建立、发现和加入大佬们的「圈子」;BYRIDEA 能标记个人的技能点和加入项目的意愿,发布自己的 IDEA 、按技能标签发送邀请、招募感兴趣的人加入。
同时 BYRCIRCLE 预计将会作为 BYRIOSC 和 BYR 系列服务的中心一站式用户系统。面向的用户以北邮校内学生为主,学院路校区和更多北京高校为辅,最大扩展到全国中学和高校,并逐步完善学校身份验证功能,具体可参考 BYRBT 的现有用户群(多地高校和中学)。
初心目标是打造成一个「BYRIOSC 社区人才库」。试图解决的痛点是:
- 想发现身边兴趣相投的人一起学习技术,却找不到人?
- 在 BYRCIRCLE 上标签筛选「Android 开发」「游戏设计」等方向!
- 有个很好的想法,却不知道去哪找大佬来实现,就差个程序员了?
- 在 BYRIDEA 上发布你的 IDEA ,选定需要的技术类型,给 CIRCLE 中有该技能点和项目意愿的推荐用户发送邀请!
- 自己有技术,却不知道哪里有项目和竞赛可以加入,也找不到人组队?
- 在 BYRIDEA 上寻找感兴趣的 IDEA 项目组,或者在 CONF 列表查看近期竞赛活动并组队!
参考竞品
- 专业社交和技能点
- 圈子
- 个性化个人页
导航结构
- 欢迎页 circle.byriosc.org
- 搜索结果页 circle.byriosc.org/search?q=
- 个人页(所有编辑状态在当前页完成)circle.byriosc.org/dimpurr
- 圈子页(所有编辑状态在当前页完成)circle.byriosc.org/c/byrdev
信息结构
- 用户
- 基础
- id (也是 url)
- 显示名
- 头像
- 签名
- 学校 (自填英文缩写)
- 学校类型 (高中,本科,硕士,博士)
- 入学年级
- 学院
- 认证学校
- 个人页
- 介绍(Markdown)
- 圈子(功能设计参考网易云歌单)
- 默认有一个「我的圈子」,类似网易云音乐「我喜欢的音乐」
- 链接
- 对可以识别的社交网络链接用特殊底色
- 基础
- 圈子
- 基础
- id (也是 url, 和用户不在一个命名空间)
- 显示名
- 签名
- 圈子主页
- 介绍、链接(同个人页)
- 圈子中的人
- 关联的圈子(类似好友系统,要双方接受邀请?)
- admin(many User)
- 基础
视觉稿#1
- 作者: @dimpurr
- 时间: 201804
内容
BYRCIRCLE 用户个人页的视觉稿。
设计细节说明
- 每个栏目前,用图标区分是 BYRCIRCLE (弧线)还是 BYRIDEA (灯泡)所属的内容
- 按照栏目进行编辑, hover 在栏目标题旁出现编辑按钮
- 「圈子」和「链接」部分都是横向滚动设计。在宽度不超过页面宽度的时候,与其他正文部分统一边距对齐。宽度超出的时候,直接对齐屏幕 Viewport 最边缘。
设计决策争议
- 关于「技能点和认可数」部分的设计, @eric 提出了一系列建议,详见评论区。视觉稿有两种方案,暂定使用第一种:
- 用户可以将一维标签自己决定分组和命名,类似 Windows 开始菜单的磁铁分组
- 没有分组,全部标签线性排列
- 全局的标签系统是否是树状的。
- 在 IDEA 列表部分, @icebound 提出信息密度过高,全是文字。尝试将项目名称和简介换行,效果并不好。
- 关于横向滚动部分,有人认为左右突出感觉突兀并且横向扫视距离长并不舒服, @tuxzz 建议不要横向滚动直接 inline-block 多行, @SakuragawaAsaba 建议把横向滚动控制在原有页面宽度内。
内容
BYRCIRCLE 圈子主页的视觉稿。
设计细节说明
- 圈子不设头像和 banner ,降低创建成本。
- 在圈子标题旁悬浮可以编辑圈子基本信息,还有控制管理权限。一个圈子可以有复数个管理员,不区分创建者或者多级权限。
[1]: https://www.zhihu.com/topic/19572918/organize/entire#anchor-children-topic "完整话题结构 - 清朝 - 知乎"
[2]: https://stackshare.io/application_and_data "Best Application and Data Software - 2018 Reviews of the | StackShare"
[3]: https://www.linkedin.com/in/dimpurr/detail/skills/ "技能认可 - LinkedIn"
3 Comments
关于个人能力描述的UI设计,交互设计和体系设计:
对应资源
,一个是检所对应高手
.工具
给用户编辑.认可
该人的能力,同时这个节点的颜色
,形态
和大小
发生变化.我认为 CIRCLE 的核心是人,和人们所组成的(圈子,项目,竞赛和活动)