Graduation Album | 毕业纪念册

Cover Image

Introduction | 简介

毕业纪念册 是我在大学毕业之际与两位队友合作的微信网页项目。此项目的主要功能是让毕业生在线上互相书写赠言,并且可以在微信朋友圈分享自己的留言本。

项目链接(请用微信浏览器打开)
项目推广文案(微信推送)

Background | 灵感来源

这个项目的灵感来源于小学和中学时期流行的同学录,在毕业的时候,班里面的每个同学都要在一本同学录里写下联系方式和毕业赠言。临近大学毕业的时候我的室友也递给了我一本纸质留言本,让我给她留言,我当时想着用手写的方式太“Old School”,而且效率不高。于是我就萌生了做一个“线上同学录”的想法,可以让毕业生互相写毕业赠言,并且能够被分享到朋友圈邀请所有的好友来写。

Preparation | 前期准备

有了初步的想法后,我就跟和我同为计算机专业的朋友们组成一个小队,分工合作,开始着手做这个项目了。在团队合作中,我负责的是项目的整体UI和风格设计。

因为时间有限,我们项目最初的版本只提供了一些最简单的功能(按照页面分类):

  • 平台支持
    • 支持微信登陆
    • 支持分享到朋友圈
  • 赠言界面
    • 给他人赠言,支持emoji
    • 自定义昵称,支持匿名
  • 个人主页
    • 创建纪念册,自定义标题和介绍
    • 查看纪念册(别人给“我”写的赠言)
    • 查看我给他人的赠言

User Flow | 产品流程图

User Flow | 产品流程图:
User Flow Image

Low-Fidelity UI Design | 产品低保真设计图:
Low Fidelity Image

UI Design | UI 设计

为了更好跟负责前端的同学协作,我使用了Figma作为UI设计的主要工具。这是我第一次使用Figma,因为我之前用过Sketch和Adobe XD,所以在使用Figma的时候可以很快上手,这些软件的功能大体都是相通的。

Style | 产品风格设计:
Style Image

High-Fidelity UI Design (Main Pages) | 高保真UI设计图 (主页面):
High Fidelity Image

Final Demo | 最终效果

朋友圈分享:
Share Image

填写赠言:
Final Demo Image

Future Updates | 后续更新

《毕业纪念册》项目第一版本已于2021年5月21日上线,未来我们团队还会持续对此项目进行功能的更新和优化,敬请期待~

Acknowledgement | 致谢

特别致谢两位优秀的同学&朋友&队友:郭琪聪和谢国超。另外还要感谢 Apartsa 为我们提供了服务器和后续的运营支持。