β阶段博客

个人工作分工

项目设计架构概述

从整体上,本项目采用前、后端分离的开发思路,分成UI组、前端组、后端组,相对独立地开发每个模块,从而实现快速安全迭代,实现敏捷开发。

从实现技术上,前端采用Uniapp+Vue多端开发,后端主要采用Django架构+MySQL数据库。

从管理模式上,本项目采用Mentor+成员机制,Mentor提前学习熟悉相关模块的特性和实现,然后指导对应小组成员实现快速入门,从而实现快速迭代开发。

1. UI设计组

Mentor:易率

组员:庾子睿,阿牛牛牛,齐帅恒,张艺霖,邵钰棠

无需代码设计UI界面,主要完成大致的页面分布和交互逻辑的设计。

用户交互逻辑设计

第一次打开:

登录欢迎页->手机号注册页->主页面

发布拼车需求:

主页面->拼车页面(通过底部导航栏切换)->拼车需求填写页面(通过点击右上角加号)->拼车页面(发布成功后自动回弹)

直接加入其他人发布的拼车需求:

主页面->拼车页面(通过底部导航栏切换)->拼车详细信息(点击某一条)->确认加入拼车(点击页面上加入按钮)

联系拼车队长:

主页面->拼车页面(通过底部导航栏切换)->拼车详细信息(点击顶部悬浮当前拼车)->点击电话号码->拉起系统拨打功能

UI概览

在这里插入图片描述
在这里插入图片描述

2. 前端设计开发(至少3人)

Mentor:梁俊猛

组员:冯钰恒,易率,张艺霖,庾子睿

实现设计出来的UI界面,完成与后端api的交互

技术栈:

Uniapp+Vue,实现微信小程序及多端开发

技术路线:

安装node.js、Vue、Uniapp、HBuilder X、微信小程序开发环境:

1、node.js:

https://nodejs.org/zh-cn

2、Vue的安装:

https://cn.vuejs.org/guide/introduction.html

3、uniapp、HBuilder X:

https://uniapp.dcloud.net.cn/

4、微信小程序安装

https://mp.weixin.qq.com/

安装git,并学习常用git指令

具体

整个APP可分割成多个页面,对每个页面进行设计开发。

有许多常用的设计案例,如登录模块、用户模块,须多进行借鉴,避免重复造轮子。

先将仓库clone下来,里面的UNIAPP有一个现成的比较好的打车前端界面,可供参考。

负责组员仓库:https://gitee.com/fyhfree/letsgo

3. 后端设计开发(至少3人)

Mentor:冯钰恒

组员:梁俊猛

实现后端api的设计,完成api接口编写、测试,编写api交互文档

技术栈: Python Django、MySQL数据库

实现模块:登录模块、信用机制设计、导航路线设计

技术路线:

  1. 安装Python Django
  2. 熟悉宝塔网站
  3. 学习MySQL常用指令

负责组员仓库:https://gitee.com/fyhfree/letsgo

本周个人工作

图标及UI界面设计组

已完成

  • 使用墨刀和Figma工具完成了初步UI框架的设计,包括页面大致分布和主要交互逻辑。
  • 从墨刀的常用模板中选择了合适的界面模板,并进行修改式设计,创建了初步的视觉原型。
  • 在Notion平台上整理和分享了设计过程中的文档和设计材料,确保团队的沟通顺畅。

计划完成

  • 深入优化现有的UI设计,增加细节元素以提升用户体验。
  • 进行可用性测试,收集反馈并进行调整。
  • 准备最终的UI设计文档,供前端开发团队参考。

易率

总体设计,设计开始页面与总体页面架构。为其他同学提供指导。
在这里插入图片描述

庾子睿

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

阿牛牛牛

在这里插入图片描述

齐帅恒

在这里插入图片描述

张艺霖

在这里插入图片描述

前端设计开发组

已完成

  • 完成开发环境的搭建,包括Node.js、Vue、Uniapp、HBuilder X以及微信小程序开发环境。
  • 学习并掌握常用的Git指令,为后续的协作开发奠定基础。
  • 克隆了现有的Uniapp打车前端界面项目,并研究其代码结构和实现细节。

计划完成

  • 基于UI设计实现应用的关键页面,并与后端API进行初步集成。
  • 使用Uniapp+Vue技术栈,实现微信小程序及其他端的跨平台开发。
  • 借鉴现有的设计案例,如登录模块和用户模块,尽量复用现有方案以提高开发效率。

梁俊猛

在这里插入图片描述
在这里插入图片描述
完成了两个部分的前端代码设计,实现了很多功能。

后端设计开发组

已完成

冯钰恒

  • 完成后端开发环境的搭建,包括Python Django和MySQL数据库。
  • 学习和熟悉了Django的基本使用和MySQL的常用指令。
  • 初步设计了后端API的接口和数据模型,计划实现登录模块、信用机制和导航路线设计。
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述

Django端口设计

在这里插入图片描述
在这里插入图片描述

信用评级机制

在这里插入图片描述
在这里插入图片描述

计划完成

  • 编写并测试关键API接口,确保与前端的顺畅交互。
  • 制定详细的API文档,方便前端开发人员理解和使用。
  • 对现有的信用机制和导航模块进行详细设计和实现,并进行初步的功能测试。

燃尽图

在这里插入图片描述

仓库演化图

在这里插入图片描述

在这里插入图片描述

例会照片

在这里插入图片描述

庾子睿 https://gitee.com/fyhfree/letsgo/issues/IB0QPA

https://gitee.com/fyhfree/letsgo/issues/IB0RO8

https://gitee.com/fyhfree/letsgo/issues/IB0RNV

冯钰恒 易率 https://gitee.com/fyhfree/letsgo/issues/IB0QU6
https://gitee.com/fyhfree/letsgo/issues/IB0RIZ
https://gitee.com/fyhfree/letsgo/issues/IB0RIS
https://gitee.com/fyhfree/letsgo/issues/IB0RIH
https://gitee.com/fyhfree/letsgo/issues/IB0RHZ
梁俊猛 https://gitee.com/fyhfree/letsgo/issues/IB0QY6
阿牛牛牛 https://gitee.com/fyhfree/letsgo/issues/IB0QZ2
齐帅恒 https://gitee.com/fyhfree/letsgo/issues/IB0RKQ
张艺霖 https://gitee.com/fyhfree/letsgo/issues/IB0QZQ
在这里插入图片描述
在这里插入图片描述

服务器后端部署

在这里插入图片描述
在这里插入图片描述

【个人总结】

冯钰恒:

   本小组总结:本阶段本小组基本完成了所有的UI设计部分,整体转向前端的精进开发学习,从而优化前端视觉效果,向理想UI设计靠拢。

     这一阶段我实现了多个前端局部组件,包括拼车展示组件、注册组件等。优化了视觉效果。搭建了后端平台,完成了数据库的构建。利用axio函数库完成了前端与后端的连接。为小组其他成员一同学习了git的优化使用,实现了协同合作。

     下一阶段,我们小组主要进一步分工合作,完成前端的视觉设计实现,从而冲刺完成较好的小程序效果。各页面分工如下所示:

   

代码提交记录:

易率:

     统筹了UI的总体设计,指导了小组成员完成UI工作,完成了登录页面、注册页面的UI设计。  

     目前,UI界面的设计已基本完成,但逻辑交互较为简单,尚未实现更复杂的功能。接下来的工作将使用Vue框架编写前端UI代码,并在此基础上增加更多交互功能,例如乘车人数和乘车时间的选择等。

     本周计划完成UI的前端代码开发,并完善拼车历史记录展示功能,支持分页加载及界面下拉刷新、上滑加载更多、拨打电话等交互效果。随后,将与后端开发人员协作,完成前后端的数据交互,完善后端API,包括用户信息管理和拼车需求管理,确保前后端数据同步,并支持用户发布与响应拼车需求。

庾子睿:

      这一阶段我做的是拼车平台的Figma部分UI设计和前端设计开发工作。UI设计方面,设计了一个直观的个人信息展示界面,允许用户查看和编辑基本信息,如头像、用户名等。用户点击头像板块时,会弹出提示框,同时其他部分会变为灰暗以突出效果。其次设计了仿照微信界面的弹出框,让用户选择拍照或从相册中选择照片来修改头像。在名字和性别板块,用户点击后会弹出相应的修改界面,其中性别图标因为Figma中找不到对应图标所以我是从flaticon网站转换而来的svg格式。“我的旅程”界面,展示了正在进行和已完成的订单记录,其中已完成的订单以灰色显示,进行中的订单则用彩色图标表示,绿色pin icon代表起点,蓝色pin icon代表终点。用户可以通过点击trash icon来删除已完成的订单,点击确认后该记录将从后端数据库中删除;点击取消则返回“我的旅程”界面。

      本周准备完成UI的前端代码实现,完善拼车历史记录展示功能,支持分页加载和一些界面的下拉刷新、上滑加载更多、电话拨打等交互功能。之后会与后端开发人员合作完成前后端交互,完善后端API,包括用户信息管理和拼车需求管理,确保前端与后端数据同步,并支持用户发布和响应拼车需求。

齐帅恒:

在之前的阶段已经大致完成了新建拼车信息填写的ui页面,其中包括起点终点的输入,出发到达时间和拼车人数的选择,并设计了其中的逻辑交互。

      目前ui界面设计完成了基本工作,但是逻辑交互较为简单,无法实现更多更复杂的功能,在后续工作中,需要使用vue工具实现前端ui界面的代码,并且在代码中实现增加更多的交互功能,包括乘车人数和乘车时间的选择等功能。

本周继续完善拼车app中的新建拼车信息填写的页面,改善了字体等页面细节,增加了一些页面的交互,增加了搜索按钮,在完成信息的的填写的同时新建一个拼车任务,用于搜索起点和目的地相同的的其他用户的拼车任务。

梁俊猛:

       在之前阶段已设计了登录注册选择页面、登录页面以及首页和个人页面的大体设计,还有个人信息页面、头像点击功能的设计,此次大体设计了首页添加的模块点击后的页面,便于之后添加聊天和加入拼车等功能:

      本周将继续完善聊天页面的美观程度以及按钮具体功能的实现,同时也会试着处理其他页面关于前后端数据交互的相关代码,比如登录页面的数据交互,之前试着用云函数实现成功,同理之后使用axio实现同样的功能。

代码提交记录:

张艺霖:

在之前阶段负责的是拼车平台的Figma部分UI设计和前端设计开发工作,已经完成的工作有设置,帮助和反馈界面的UI设计,其中包括更新检查、消息通知、意见反馈和使用帮助。

本周继续完善UI界面的细节,改进位置的选取和图标的美观程度,以及与小组统一了字体的选取。现在转入界面的前端实现。下一步将继续帮助等界面的前端实现,将UI的设计效果呈现出来,并实现页面的跳转功能等。

阿牛牛牛:

      在之前阶段已完成负责的拼车平台的Figma部分UI设计和前端设计开发工作任务。设计了已发起的拼车信息详情页界面,使用户直观看到别人发起的或者自己发起的拼车信息,如起点、终点,已拼人数等。其次设计了已加入的拼车详情页,让用户直观感受到已加入拼单。在修改电话板块,用户点击后会弹出相应的修改界面,输入新号码,同行绿色保存图标即会亮起,点击保存即完成修改,则返回个人信息界面。

      本周将继续完成UI的前端代码实现,同时完善此前已完成的UI设计。具体将实现修改电话号码信息界面等的前端代码部分。

【会议交流文档】

           仓库地址:letsgo: 大学城拼车平台,实现轻松高效拼车!

【会议交流文档】

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值