Đang tải... (xem toàn văn)
Tiến hành đánh giá nhu cầu - Giải quyết nhu cầu : App học tập có các video học online với các chủ đề : C/C++, Java , JavaScript ,Lập trình web ,python ,thuật toán … - Đối tượng : Sinh vi
Trang 1TRƯỜNG ĐẠI HỌC ĐIỆN LỰC
KHOA ĐIỆN TỬ - VIỄN THÔNG
CỘNG HOÀ XÃ HỘI CHỦ NGHĨA VIỆT NAMĐộc lập - Tự do - Hạnh phúc
BÁO CÁO TIỂU LUẬN HẾT HỌC PHẦNMôn: Phát triển ứng dụng trên thiết bị di dộng
Tên đề tài: Thiết kế và lập trình ứng dụng học lập trình online
Hà Nội 2023
Trang 2MỤC LỤC
I Xác định dự án thiết kế 6
1 Tiến hành đánh giá nhu cầu 6
2 Xác định các bên liên quan 6
2.1 Các bên liên quan chính 6
2.2 Các bên liên quan thứ cấp 6
2.3 Các bên then chốt 7
3 Hiểu bối cảnh xã hội của đối tác cộng đồng 7
4 Xác định yêu cầu cơ bản của bên liên quan 8
5 Xác định giới hạn thời gian của dự án 8
II Phát triên đặc tả kĩ thuật 8
1 Hiểu và mô tả ngữ cảnh 8
2 Tạo hồ sơ các biên liên quan 9
3 Tình huống người dùng 9
4 Tạo mô hình và nguyên mẫu cho ứng dụng học lập trình 10
5 So sánh với các sản phẩm tiêu chuẩn 10
6 Xác định nhu cầu của khách hàng 10
7 Thiết lập tiêu chí đánh giá 11
8 Phát triển đặc tả kĩ thuật của khách hàng 11
III GIAI ĐOẠN THIẾT KẾ Ý TƯỞNG 12
IV Thực hiện thiết kế chi tiết 14
1 Tiến hành lên bố cục app học tập 14
2 Thiết kế giao diện, xây dựng cơ sở dữ liệu, nội dung app chi tiết 14
2.1 Giao diện người dùng 14
2.2 HomeFragment: 15
2.3 Search Fragment: 22
2.4 Learn Fragment 23
2.5 Profile Fragment 26
Trang 33 Lập trình tính năng app 20
4 Test và fix lỗi app 20
5 Kiểm tra khả năng sử dụng và phản hồi người dùng 21
V Công việc cá nhận……….28
Trang 4I Xác định dự án thiết kế
1 Tiến hành đánh giá nhu cầu
- Giải quyết nhu cầu : App học tập có các video học online với các chủ đề : C/C++, Java , JavaScript ,Lập trình web ,python ,thuật toán …
- Đối tượng : Sinh viên
- Hiện tại trên Cửa hàng ứng dụng CHplay của google cung một số sản phẩm như app học tập như LearnCoding , Sololearn ,…
- Các vấn đề mà nhóm tôi muốn thúc đẩy dự án :
+ Giúp cho Sinh viên , người muốn học lập trình được tiếp cận với tài liệu theo đúng chủ đề muốn học
+ Sinh viên ,người học lập trình dễ dàng truy cập vào các video bài học theo từng khóa học từ cơ bản đến nâng cao với từng chủ đề một
+ Sau mỗi khóa học sinh viên ,người muốn học lập trình sẽ được tự đánh giá kiến thức của mình qua các bài test trắc nghiệm.
- Mục tiêu chính của dự án :
+ Hoàn thiện web trắc nghiệm , giáo viên và sinh viên truy cập tạo và hoàn thiện được bài test đúng với thời gian được đặt ra đánh giá được năng lực của học sinh.
+ Hoàn thiện app học lập trình sinh viên, , sinh viên xem được các video bài học và làm được các test trắc nghiệm sau mỗi khóa
- Việc giải quyết nhu cầu này rất quan trọng với sinh viên được tiếp cận với nguồn tài liệu học lập trình phong phú , được tự đánh giá kiến thức của mình.
2 Xác định các bên liên quan 2.1 Các bên liên quan chính
Sinh viên
2.2 Các bên liên quan thứ cấp Nhóm quản lý nội dung khóa học
2.3 Các bên then chốt
Sinh viên , nhóm phát triển app
- Mối quan tâm của sinh viên với app học lập trình + Truy cập dễ dàng vào các bài học theo dạng chủ đề + Dễ dàng thao tác , tránh được những thao tác rườm rà
+ Sau các bài test trắc nghiệm đánh giá được lượng kiến thức của mình sau khi học + Có thể học mọi lúc , mọi nơi
- Việc bảo trì dự án được tuân thủ theo thời gian cố định từ nhóm của tôi đưa ra là 1 năm /1 lần - Đối với mỗi bên đều có người liên hệ chính :
+ Bên phía người dùng : Bộ phận hỗ trợ khách hàng
Trang 5+ Nhà phát triển : Tôi
- Khi xây dựng app học lập trình nhóm tôi có các vị trí chịu trách nhiệm : + Huyền ,Đức , Đức : Phát triển backend
+ Hân, Sơn : Thiết kế giao diện
- Mối quan tâm mà các bên khi tham gia dự án
+ Nhóm tôi : Thời gian hoàn thành app học lập trình, các video khóa học xem được, dữ liệu các bài test thông suốt
+ Sinh viên : Thao tác dễ dàng, truy cập được các bài học theo đúng các chủ đề muốn học, tự đánh giá được kiến thức qua các bài test, app không bị lag,…
3 Hiểu bối cảnh xã hội của đối tác cộng đồng
Nhiệm vụ của sinh viên : Cần làm rõ các yêu cầu cụ thể về các kiến thức muốn học, web như số lượng giáo viên truy cập, số lượng học sinh truy cập ,giáo viên cần có tài khoản riêng quản lý được các học sinh,…
Bộ phận khảo sát người dùng thu thập các ý kiến từ những học sinh và sinh viên trải nghiệm app để đóng góp ý kiến và thảo luận với bạn thiết kế giao diện của nhóm.
Những sinh viên có thể đóng góp ý kiến để nhóm có thể tối ưu sao cho việc sử dụng app dễ dàng , tránh các thủ tục rườm rà như nhập mã capcha , cắt giảm bớt một số bước xác nhận.
Thách thức xã hội mà dự án giữa nhóm đang cố gắng giải quyết:
Kiến thức lập trình liên tục được cập nhật theo thời gian, các bài test trắc nghiệm sau khóa học nên có kiến thức giúp cho việc ôn tập dễ dàng
Sinh viên có thể sử dụng app học lập trình (app Education ) được tiếp thu kiến thức dễ dàng hơn so với Coding app vì khi sử dụng Coding app sinh viên phải có kiến thức một chút mới làm được trắc nghiệm còn app Education của nhóm thêm phần video lý thuyết sinh viên có thể xem video lý thuyết trước sau đó mới kiểm tra lại kiến thức của mình qua bài test.
4 Xác định yêu cầu cơ bản của bên liên quan
Sinh viên: Giao diện trực quan, dễ dàng đăng ký, đăng nhập để truy cập được vào các bài học lập trình, làm được các test trắc nghiệm sau mỗi khóa học.
5 Xác định giới hạn thời gian của dự án
- Dự án được triển khai theo thời gian trước kết thúc môn học + Thời gian triển khai cụ thể bắt đầu từ 5/2/2023 + Thời gian ước tính hoàn thiện : 12/4/2023 - Các yếu tố liên quan đến tiến độ dự án :
+ Thời gian kết thúc dự án
+ Các yêu cầu , các ý kiến góp ý từ phía sinh viên - Các nguồn lực quan trọng ảnh hưởng đến tiến độ dự án :
Trang 6+ Thời gian hoàn thiện dự án + Khó khăn trong việc code sản phẩm + Nội dung của các khóa học phù hợp hay không ? …
II Phát triên đặc tả kĩ thuật
1 Hiểu và mô tả ngữ cảnh
- Học tập trực tuyến: Ứng dụng có thể được sử dụng để cung cấp các khóa học trực tuyến, bài giảng và tài liệu học tập cho sinh viên
- Dự án sẽ là nơi cung cấp các bài giảng theo video về các chủ đề lập trình các ngôn ngữ như : C/C+ +, Java, JavaScript, lập trình web, python….
- Và hướng vào đối tượng như:Sinh viên
- Một số hoạt động của học tập trực tuyến sẽ bao gồm các phần: + Truy cập vào nội dung giảng dạy
+ Đăng ký,đăng nhập và tham gia khóa học + Kiểm tra và đánh giá kiến thức + Tiến độ các khóa học đã hoàn thành
2 Tạo hồ sơ các biên liên quan - Các bên liên quan chính cần :
+ Đưa ra những yêu cầu về kiến thức, những trải nghiệm sử dụng ứng dụng, thời gian của các khoá học
+ Trao đổi cách học, cách kiểm tra (học theo video hay học theo module, kiểm tra theo kiểu trắc nghiệm lý thuyết hay bài tập ứng dụng… )
- Các bên liên quan thứ cấp cần:
+ Trao đổi với bên liên quan chính, từ đó đưa ra được những đóng góp về khoá học, kiến thức của khoá học
+ Xây dựng hệ thống bài test kiến thức xuyên suốt khoá học.
+ Xây dựng giao diện thân thiện, dễ sử dụng, cung cấp những khoá học tương ứng theo nhu cầu, đảm bảo chất lượng của khoá học.
+ Hỗ trợ người sử dụng khi có sự cố xảy ra 3 Tình huống người dùng
- Sinh viên mới muốn tìm hiểu về khóa học cụ thể: Sinh viên mới có thể sử dụng tính năng tìm kiếm để tìm khóa học phù hợp với mục tiêu học tập của mình Sau đó, họ có thể đọc thông tin chi tiết về khóa học để có thể xem những nội dung đó có phù hợp với nhu cầu tìm hiểu của bản thân.
Trang 7- Sinh viên muốn truy cập các tài liệu học tập: Sinh viên có thể sử dụng tính năng tra cứu để tìm kiếm các khóa học hoặc tính năng bài viết mới để cập nhật các tài liệu, xu hướng công nghệ
- Sinh viên muốn đăng ký khóa học: Sinh viên có thể sử dụng tính năng đăng ký khóa học trong module profile khi sinh viên mới bắt đầu sử dụng để đăng ký Sau đó, họ có thể truy cập khóa học và bắt đầu học tập.
- Sinh viên muốn tự đánh giá kiến thức sau khóa học: Sau khi hoàn thành khóa học, sinh viên có thể sử dụng tính năng làm test để tự đánh giá kiến thức của bản thân sau khi học khóa học và chia sẻ trải nghiệm học tập của mình với người khác.
- Sinh viên muốn quản lý tài khoản: Sinh viên có thể sử dụng tính năng đăng nhập, đăng xuất để có thể đăng nhập vào tài khoản của mình khi đăng ký để lưu quá trình học ,còn đăng xuất khi không muốn sử dụng tài khoản đấy trong việc học.
4 Tạo mô hình và nguyên mẫu cho ứng dụng học lập trình Bản thiết kế mô hình ứng dụng học lập trình gồm các phần:
- Đăng ký và đăng nhập - Hồ sơ cá nhân (Profile) - Trang chủ: hiển thị các khóa học
- Chức năng học tập:Lưu trữ trữ tiến trình học của các khoá học ( hoàn thành hay chưa hoàn thành)
- Chức năng tìm kiếm các khoá học - Các khoá học
- Các bài test cho từng khoá học 5 So sánh với các sản phẩm tiêu chuẩn
- Nhu cầu của các bên liên quan khác với những sản phẩm hiện có như app coding trên CHplay
- App coding : Có giao diện bắt mắt , dễ sử dụng tuy nhiên với đối tượng sinh viên phải mất phí thanh toán 1 khoản để nâng cấp tài khoản
- App coding hiện tại chỉ có các bài test kiến thức theo chủ đề sinh viên muốn học nên với những sinh viên mới bắt đầu học lập trình chưa thể làm được.
- Với app Education của nhóm em phát triển: + Có giao diện đơn giản , dễ sử dụng + Hoàn toàn free đối với sinh viên
+ Cung cấp mọi khóa học bao gồm video học lý thuyết và kiểm tra kiến thức qua các bài test.
Trang 86 Xác định nhu cầu của khách hàng
- Khảo sát sinh viên về nhu cầu với ứng dụng học lập trình từ đó đưa ra một những nhu cầu cơ bản cần có ví dụ như:
+ Chất lượng nội dung khoá học, bài kiểm tra
+ Giao diện thân thiện, dễ sử dụng, trực quan cho phép người dùng dễ dàng tham gia, sử dụng
+ Bảo mật thông tin người dùng + Đa dạng và linh hoạt
- Sau khi nắm bắt được những yêu cầu của sinh viên đội ngũ phát triển sẽ đưa ra phương án triển khai phù hợp, hợp lý hơn.
7 Thiết lập tiêu chí đánh giá
Để xác định tiêu chí đánh giá cho một trang app học tập, cần phải đảm bảo rằng các yêu cầu và mong đợi của sinh viên và các bên liên quan đã được đưa ra và xem xét Một số tiêu chí đánh giá cơ bản:
- Nội dung học tập: Tiêu chí này đánh giá chất lượng và tính đầy đủ của nội dung học tập trên app Nội dung nên được phân loại theo chủ đề rõ ràng
- Giao diện người dùng: Đánh giá tính thân thiện và trực quan của giao diện người dùng của ứng dụng bao gồm khả năng truy cập, bố cục, hình ảnh, màu sắc, kích thước phông chữ và các thành phần khác
- Tính năng và công nghệ: Đánh giá các tính năng của ứng dụng , bao gồm các công nghệ được sử dụng, tính năng tìm kiếm, tính năng tương tác, tính năng đánh giá, khả năng kết nối với các
- Giao diện dễ sử dụng và thân thiện với người dùng - Có chức năng tìm kiếm nhanh các khóa học.
- Hỗ trợ đa ngôn ngữ và các công cụ học tập trực tuyến như bài kiểm tra, video, tin tức…
Hiệu suất
- Tốc độ tải trang nhanh và không bị gián đoạn.
- Hệ thống không bị treo hoặc bị lỗi khi đăng ký hoặc đăng nhập - Hỗ trợ truy cập từ các thiết bị di động
Bảo mật - Đảm bảo bảo mật thông tin người dùng và dữ liệu học tập.
- Sử dụng các giao thức bảo mật SSL/TLS để mã hóa thông tin truyền tải giữa máy tính của người dùng và server.
Trang 9- Có chức năng xác thực người dùng, giảm thiểu rủi ro xâm nhập trái phép.
Thiết kế giao diện
- Thiết kế giao diện đơn giản, dễ nhìn và thân thiện với người dùng - Sử dụng các hình ảnh, màu sắc tạo cảm giác thoải mái cho người dùng - Các trang layout được tối ưu hóa để hiển thị tốt trên các thiết bị khác nhau như điện thoại, máy tính bảng
III GIAI ĐOẠN THIẾT KẾ Ý TƯỞNG
1 Phân rã chức năng
Là quá trình phân tích và chia nhỏ các chức năng của sản phẩm thành các phần nhỏ hơn và dễ quản lý hơn Việc phân rã chức năng giúp cho quá trình phát triển sản phẩm trở nên dễ dàng hơn và đảm bảo rằng các chức năng của sản phẩm được phát triển đầy đủ và hiệu quả.
Liệt kê chức năng
2 Nghiên cứu sản phẩm đã có
Sản phẩm về học lập trình hiện đã có trên cửa hàng tải app di động CHplay và nhóm đã nghiên cứu qua sản phẩm app mimo.
App mimo là một app lập trình được viết bằng ngôn ngữ java và koltin App sử dụng các bài test trắc nghiệm ngắn trong mỗi bài học.
Sơ đồ phân cấp chức năng của app học lập trình
Trang 10Giao diện của app mimo được tối giản hóa để người dùng tập trung vào quá trình học tập Tuy nhiên app có nội dung học hạn chế , không đánh giá được kiến thức người dùng Không phù hợp với người chưa có kiến thức lập trình …
4 Đánh giá tính khả thi của giải pháp tiềm năng
- Giao diện tối ưu phù hợp cho sinh viên tập trung quá trình học tập; - Nội dung học phong phú, đa dạng;
- Tiến trình học lưu được quá trình học của sinh viên , sinh viên biết mình đã học được tới đâu.
Tính khả thi của các giải pháp tương đối 5 Ma trận quyết định
Hiệu suất chức năng
- Tốc độ xử lý nhanh
- Khả năng lưu trữ được tiến trình học - Khả năng kết nối với cơ sở dữ liệu Tính thẩm mỹ - Giao diện tối ưu, đơn giản
- Các module chức năng được chia rõ ràng
Tính toàn diện - Đối tượng sinh viên muốn học lập trình - Có tư duy logic tìm hiểu kiến thức
Khả năng sử dụng - Giao diện rõ ràng
- Sự rõ ràng của các module chức năng 6 Chọn giải pháp tốt nhất
Phát triển các tiêu chí
Trang chủ
Trang chủ cần có giao diện tối ưu, đơn giản Các khóa học được bố trí theo giao diện dễ nhìn thấy.
- Sinh viên tập trung trong việc học; -Sinh viên dễ dàng nhìn thầy các khóa học và đưa ra lựa chọn nhanh để chọn khóa học.
Tìm kiếm Tìm kiếm theo từ khóa Sinh viên dễ dàng tìm kiếm theo từ khóa tên khóa học mình muốn học Quá trình học Lưu theo khóa học đã hoàn thành
hay chưa
Sinh viên có thể xem khóa nào mình đã học và khóa nào mình chưa học
Tài khoản Đăng nhập, đăng ký cho sinh viên.
Sinh viên đăng ký tài khoản để học cá nhân Sau khi đăng ký chỉ việc đăng nhập thay vì đăng ký như lúc đầu.
Trang 11IV Thực hiện thiết kế chi tiết
1 Tiến hành lên bố cục app học tập
Trong đó một app cần có yêu cầu cũng như các trang quan trọng như:
- Hiển thị danh sách các khóa học, phân chia theo danh sách các khóa học được xem nhiều nhất, mới nhất, theo chủ đề…;
- Tổ chức Firebase lưu trữ thông tin các khóa học, thông tin bài viết, thông tin người dùng (gồm email, password, các khóa học mà người dùng đã đăng ký)…;
- Đăng nhập, đăng ký tài khoản; - Tìm kiếm theo tên các khóa học;
- Hiển thị thông tin khóa học gồm các bài giảng, các video, câu hỏi tương ứng 2 Thiết kế giao diện, xây dựng cơ sở dữ liệu, nội dung app chi tiết
Đây là trang giao diện app sẽ có trong app học tập:
2.1 Giao diện người dùng
- Gồm 4 fragment chính: HomeFragment, SearchFragment, LearnFragment, ProfileFragment
- Sử dụng Bottom Navigation + Fragment + View Pager 2 để cài đặt
Trang 122.2 HomeFragment:
- Banner: Auto Image Slider: Gồm 3 ảnh banner tự động trượt
- Code banner:
ImageSlider imageSliderBanner = view.findViewById(R.id.image_slider_banner); ArrayList<SlideModel> slideModelsBanner = new ArrayList<>();
slideModelsBanner.add(new SlideModel(R.drawable.banner_01, ScaleTypes.FIT)); slideModelsBanner.add(new SlideModel(R.drawable.banner_02, ScaleTypes.FIT)); slideModelsBanner.add(new SlideModel(R.drawable.banner_03, ScaleTypes.FIT));
TextView tvSeeMoreAllCourse = (TextView) view.findViewById(R.id.textViewSeeMoreAllCourse);
+ Sử dụng Recycler View, lấy dữ liệu từ Firebase
+ Sự kiện click -> hiển thị danh sách các khóa học theo từng chủ đề Giao diện hiển thị sử dụng Bottom Sheet Dialog, danh sách các khóa học tương tự sử dụng Recycler View
Trang 13- Danh sách các khóa học: + Sử dụng Recycler View
+ Được phân chia theo 3 danh sách: Tất cả khóa học, Khóa học mới nhất (sắp xếp theo thời gian cập nhật), Khóa học nổi bật (sắp xếp theo số lượt xem).