1. Trang chủ
  2. » Giáo Dục - Đào Tạo

Build and audio player on android platform

146 0 0
Tài liệu đã được kiểm tra trùng lặp

Đang tải... (xem toàn văn)

Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống

THÔNG TIN TÀI LIỆU

Thông tin cơ bản

Tiêu đề Build an Audio Player on Android Platform
Tác giả Trần Minh Khải, Trần Mạnh Huy, Nguyễn Quốc Đức Tín
Người hướng dẫn Trương Thị Ngọc Phượng, Msc
Trường học Ho Chi Minh City University of Technology and Education
Chuyên ngành Information Technology
Thể loại Graduation Project
Năm xuất bản 2024
Thành phố Ho Chi Minh City
Định dạng
Số trang 146
Dung lượng 7,78 MB

Các công cụ chuyển đổi và chỉnh sửa cho tài liệu này

Cấu trúc

  • CHAPTER 1. INTRODUCTION (17)
    • 1.1 Reason for Choosing the Topic (17)
    • 1.2 Goal of the Topic (18)
    • 1.3 Research Approach and Methodology (19)
      • 1.3.1 Research Subjects (20)
      • 1.3.2 Research Scope (20)
    • 1.4 Survey of the Current Situation (21)
      • 1.4.1 Application: NCT (Nhaccuatui) (21)
      • 1.4.2 Application: Zing MP3 (23)
    • 1.5 Expected Results to Achieve (26)
      • 1.5.1 Functional Outcomes (27)
      • 1.5.2 User Experience Enhancements (27)
      • 1.5.3 Technical and Developmental Deliverables (28)
    • 1.6 Scientific and Practical Meaning (28)
      • 1.6.1 Scientific Significance (28)
      • 1.6.2 Practical Applications (29)
  • CHAPTER 2. TECHNOLOGIES AND LIBRARIES (31)
    • 2.1. Back-end (31)
      • 2.1.1 NodeJS (31)
      • 2.1.2. Express (31)
      • 2.1.3. Socket.io (32)
      • 2.1.4. Morgan (33)
      • 2.1.5. Multer (33)
      • 2.1.6. JWT (34)
      • 2.1.7. Stripe (35)
      • 2.1.8. Firebase Admin (35)
      • 2.1.9. Google APIs (36)
      • 2.1.10 Firebase (37)
    • 2.2. Front-end (39)
      • 2.2.1. Figma - Ui design (39)
      • 2.2.2. Mobile (41)
      • 2.2.3 ReactJS (48)
  • CHAPTER 3. SYSTEM DESIGN (51)
    • 3.1. System architecture (51)
    • 3.2. Use case diagram (54)
    • 3.2. Use case specification (56)
    • 3.3 Class Diagram (77)
    • 3.4 Sequence Diagram (83)
      • 3.4.1 Sequence play music (83)
      • 3.4.2 Sequence signup (84)
      • 3.4.3 Sequence login (85)
      • 3.4.4 Sequence search music (86)
      • 3.4.5 Sequence join music party (87)
      • 3.4.6 Sequence upgrade premium (88)
      • 3.4.7 Sequence config profile sequence (89)
      • 3.4.8 Sequence browse songs history (90)
      • 3.4.9 Sequence browse downloaded songs (91)
      • 3.4.10 Sequence browse loved songs (91)
      • 3.4.11 Sequence load song from local storage (93)
      • 3.4.12 Sequence download music (94)
      • 3.4.13 Sequence create music party (95)
      • 3.4.14 Sequence view users (96)
      • 3.4.15 Sequence update users (97)
      • 3.4.16 Sequence delete users (98)
      • 3.4.17 Sequence view songs (99)
      • 3.4.18 Sequence create song (100)
      • 3.4.19 Sequence update songs (101)
      • 3.4.20 Sequence delete songs (102)
      • 3.4.21 Sequence view artists (103)
      • 3.4.22 Sequence create artist (104)
      • 3.4.23 Sequence update aritst (105)
      • 3.4.24 Sequence delete artist (106)
      • 3.4.25 Sequence view genres (107)
      • 3.4.26 Sequence create genre (108)
      • 3.4.27 Sequence update genre (109)
      • 3.4.28 Sequence delete genre (110)
      • 3.4.29 Sequence view albums (111)
      • 3.4.30 Sequence create album (112)
      • 3.4.31 Sequence update album (113)
      • 3.4.32 Sequence delete album (114)
      • 3.4.33 Sequence view notifications (115)
      • 3.4.34 Sequence create notification (116)
      • 3.4.35 Sequence delete notification (117)
      • 3.4.36 Sequence view banners (118)
      • 3.4.37 Sequence create banners (119)
      • 3.4.38 Sequence update banners (120)
      • 3.4.39 Sequence delete banners (121)
      • 3.4.40 Sequence admin login (122)
  • CHAPTER 4. USER INTERFACE (124)
    • 4.1 Figma Prototype (124)
      • 4.1.1 Wireframe (124)
      • 4.1.2 User Interface Prototype (125)
    • 4.2 Mobile Screen (127)
      • 4.2.1 Splash Screen (127)
      • 4.2.2 Home Screen (127)
      • 4.2.3 Music Room Screen (128)
      • 4.2.4 Library Screen (128)
      • 4.2.5 Profile Screen (129)
      • 4.2.6 Loved Song Screen, Recent Song Screen and Download Screen (129)
      • 4.2.7 Upgrade Premium Screen (130)
      • 4.2.8 Payment Sheet (130)
      • 4.2.9 Update Profile Screen (131)
      • 4.2.10 Album Screen (131)
      • 4.2.11 Media Player Screen (133)
      • 4.2.12 Music Queue Sheet (133)
    • 4.3 Web Admin UI (134)
      • 4.3.1 Login Screen (134)
      • 4.3.2 User Management Screen (134)
      • 4.3.3 Song Management Screen (135)
      • 4.3.4 Artist Management Screen (135)
  • CHAPTER 5. TESTING (136)
  • CHAPTER 6. CONCLUSION (140)
    • 6.1. ACHIEVEMENT (140)
    • 6.2. ADVANTAGES AND DISADVANTAGES (143)
      • 6.2.1. Advantages (143)
      • 6.2.2. Disadvantages (143)
    • 6.3. FUTURE WORK (144)
    • 6.4. SOURCE CODE (144)

Nội dung

1.2 Goal of the Topic The primary goal of this project is to build a convenient and modern music streaming application named THK Music that enhances the user experience through personal

INTRODUCTION

Reason for Choosing the Topic

The rapid proliferation of smartphones and the widespread adoption of the Android operating system have transformed how people interact with technology, particularly in the realm of multimedia consumption Among various multimedia applications, audio players hold a significant place due to their ability to provide entertainment, education, and information on the go With the increasing demand for versatile and user-friendly audio applications, developing a robust audio player on the Android platform presents an exciting and relevant challenge

This is some reason we choose this topic:

• Technological Relevance: The Android operating system dominates the global smartphone market, making it a critical platform for application development Understanding the intricacies of Android app development, particularly in the context of multimedia applications, is essential for aspiring software developers

• Educational Value: Building an audio player encompasses a wide range of technical skills, including user interface design, audio processing, and efficient resource management This project provides an excellent opportunity to apply theoretical knowledge in a practical setting, bridging the gap between academic learning and real-world application

• User Demand: There is a continuous demand for high-quality audio players that offer seamless playback, extensive format support, and additional features such as playlists, equalizers, and offline capabilities Developing an audio player that meets these demands can significantly enhance user experience

• Innovation Potential: The project allows for creativity and innovation in enhancing the standard functionalities of audio players By incorporating features such as voice commands, integration with streaming services, and personalized user experiences, the project can push the boundaries of traditional audio player applications

• Personal Interest: A personal fascination with both music and technology inspired the choice of this topic Combining these interests into a single project is both motivating and fulfilling, ensuring a passionate and dedicated approach to the development process

In conclusion, the choice to build an audio player on the Android platform is driven by its technological relevance, educational benefits, user demand, potential for innovation, and personal interest This project aims to create a comprehensive and user-friendly

17 audio application that caters to the needs of modern users while providing valuable learning experiences in Android development.

Goal of the Topic

The primary goal of this project is to build a convenient and modern music streaming application named THK Music that enhances the user experience through personalization and advanced features This application aims to provide users with a comprehensive music listening experience, offering a wide range of music choices and options

Key objectives of THK Music include:

• THK Music offer users an extensive library of music This integration allows users to access a diverse array of music genres, artists, and playlists, tailored to their individual preferences

• Shared Music Listening Feature: One of the innovative features of THK Music is the ability for users to listen to music together in real-time This social listening feature fosters community and shared experiences, making music consumption more interactive and enjoyable

• User-Generated Channels: THK Music empowers users to create their own music channels Users can upload their own music and make it public, allowing them to share their musical tastes and creations with the wider community This feature not only enhances user engagement but also promotes independent artists and content creators

• E-Commerce Integration for Premium Features: Incorporating e-commerce knowledge, THK Music will offer a seamless payment feature enabling users to purchase and access premium features These premium features may include ad-free listening, higher quality audio streaming, and exclusive content The payment system will be secure, user-friendly, and efficient, ensuring a smooth transaction process for users

In summary, the goal of THK Music is to develop a state-of-the-art music streaming application that offers a personalized, interactive, and user-centric music experience Enabling shared listening, supporting user-generated content, incorporating e-commerce for premium features, and leveraging machine learning for enhanced search capabilities, THK Music aims to stand out as a versatile and innovative platform in the competitive music streaming market

Research Approach and Methodology

The research approach and methodology for developing THK Music involves a combination of literature review, market analysis, user research, and iterative development The goal is to ensure a user-centric design and implementation process that aligns with the latest technological advancements and market trends The following sections outline the specific methodologies and approaches used in this project a Literature Review and Market Analysis:

Conduct a comprehensive review of existing literature on music streaming technologies, user experience design, and mobile application development

Analyze current market trends and evaluate the features and functionalities of leading music streaming applications like Spotify, SoundCloud, and Apple Music

Identify gaps and opportunities in the market to create a unique value proposition for THK Music b User Research and Personas:

Perform surveys, interviews, and focus groups with potential users to gather insights into their preferences, pain points, and desired features in a music streaming application

Develop user personas to represent the different segments of the target audience, guiding the design and feature development process c Design and Prototyping:

Create wireframes and prototypes of the application interface, incorporating feedback from user research to ensure an intuitive and engaging user experience

Utilize design thinking principles to iterate on the prototypes, continuously refining the design based on user feedback and usability testing d Development and Integration:

Implement the application using a modular approach, allowing for the seamless integration of third-party APIs from Spotify, SoundCloud, and other music platforms

Develop the core features such as personalized playlists, shared listening, user-generated channels, and e-commerce functionalities using agile methodologies to ensure flexibility and responsiveness to changes e Testing and Evaluation:

Conduct rigorous testing, including unit testing, integration testing, and user acceptance testing, to ensure the application is robust, reliable, and free of critical bugs

Evaluate the performance and user satisfaction through beta testing with a select group of users, incorporating their feedback to make final adjustments before the public release

The target audience for THK Music includes: a Music Enthusiasts: Individuals who have a deep passion for music and spend a significant amount of time listening to various genres and discovering new artists

Social Listeners: Users who enjoy sharing their music experiences with friends and family, seeking interactive and community-driven features within the application b Content Creators: Independent artists and musicians who want to share their creations with a broader audience, utilizing the platform to gain visibility and connect with listeners c Tech-Savvy Users: Individuals who are comfortable with technology and seek advanced features like machine learning-driven recommendations and seamless integration with other digital services d Frequent Streamers: Users who regularly stream music and are willing to pay for premium features such as ad-free listening, high-quality audio, and exclusive content

The research scope for developing THK Music includes:

Integration of APIs from popular music streaming platforms such as Spotify and SoundCloud to provide a vast library of music

Development of core features including personalized playlists, shared listening capabilities, user-generated music channels, and secure payment systems for premium features

Implementation of machine learning algorithms to enhance search functionality and provide personalized recommendations

User interface design and experience optimization based on user feedback and usability testing

The creation of a proprietary music library independent of third-party APIs

Development of features not directly related to music streaming, such as video streaming or podcast integration, unless they are part of a future expansion plan

Comprehensive support for all possible music streaming platforms beyond the initially targeted services like Spotify and SoundCloud

Addressing platform-specific issues for operating systems other than Android, unless future expansion plans include iOS or web-based versions

By clearly defining the research subjects and scope, this project aims to deliver a focused and high-quality music streaming application that meets the needs of its target audience while laying the groundwork for future enhancements and expansions.

Survey of the Current Situation

The development of THK Music is informed by a thorough survey of existing music streaming applications, focusing on their strengths and weaknesses By understanding the current landscape, we can identify opportunities for improvement and differentiation Two prominent music streaming applications in Vietnam, NCT (Nhaccuatui) and Zing MP3, provide valuable insights for our analysis

NCT is one of the most popular music streaming services in Vietnam, offering a vast library of songs, albums, and playlists across various genres

Figure 1 Mp3 player UI of NCT

Figure 2 HomePage UI of NCT

• Extensive Music Library: NCT boasts a comprehensive collection of local and international music, catering to diverse musical tastes

• User-Generated Content: Users can create and share their playlists, fostering a community-driven environment

• Offline Listening: Premium users can download songs for offline playback, enhancing the convenience of music consumption

• Music Videos: In addition to audio tracks, NCT offers a wide range of music videos, providing a multimedia experience

• User Interaction: Features like comments and song requests enable user interaction and engagement with the content

• Large User Base: NCT’s popularity ensures a vibrant user community and extensive content availability

• Content Variety: The platform’s wide range of songs and music videos caters to different preferences and enhances user engagement

• Offline Mode: The ability to download music for offline listening is a significant advantage for users with limited internet access

• User Interface: Some users find the interface to be cluttered and not as intuitive as other platforms

• Ad-Supported Free Version: The free version contains numerous ads, which can disrupt the user experience

• Limited Personalization: Compared to global platforms like Spotify, NCT’s personalization features are relatively basic

Zing MP3 is another leading music streaming service in Vietnam, known for its extensive music collection and user-friendly interface

Figure 3 HomePage UI of ZingMp3

Figure 4 zingchart UI of ZingMp3

Figure 5 Profile UI of ZingMp3

• Vast Music Library: Zing MP3 offers an extensive range of songs, including popular Vietnamese tracks and international hits

• High-Quality Audio: The platform provides high-quality audio streaming, appealing to audiophiles

• User Playlists: Users can create, share, and discover playlists, promoting user engagement and music discovery

• Music Videos and Lyrics: Zing MP3 integrates music videos and song lyrics, enhancing the overall listening experience

• Social Features: Users can follow their favorite artists and friends, keeping up with their latest activities and shared music

• User-Friendly Interface: Zing MP3 is praised for its clean and intuitive interface, making it easy for users to navigate and find music

• High-Quality Streaming: The availability of high-quality audio streams caters to users who prioritize sound quality

• Rich Content: The inclusion of music videos and lyrics adds value to the audio streaming experience

• Ads in Free Version: Similar to NCT, the free version of Zing MP3 includes ads that can interrupt the listening experience

• Limited Global Reach: Zing MP3’s focus on the Vietnamese market may limit its appeal to international users

• Subscription Model: Some users may find the subscription cost for premium features to be relatively high compared to global competitors

Both NCT and Zing MP3 offer a wealth of features that cater to the Vietnamese market, with extensive music libraries, user-generated content, and multimedia integration However, they also face challenges such as intrusive ads in their free versions, relatively basic personalization features, and interfaces that could benefit from further refinement

By analyzing these existing solutions, THK Music aims to incorporate their strengths while addressing their weaknesses This includes offering a clean and intuitive user interface, advanced personalization through machine learning, minimal ad interruptions, and innovative features like real-time shared listening and user-generated channels Additionally, leveraging APIs from international platforms like Spotify and SoundCloud will ensure a diverse and comprehensive music library, appealing to both local and global audiences

By learning from the current landscape and innovating on existing solutions, THK Music aspires to provide a superior and modern music streaming experience that stands out in the competitive market.

Expected Results to Achieve

The development of THK Music is aimed at achieving several key outcomes and deliverables that will ensure the application meets the needs and expectations of its users The anticipated results encompass both functional aspects and user experience enhancements, positioning THK Music as a competitive and innovative music streaming solution

• Comprehensive Music Library: Ensure the library includes a wide range of genres, artists, and playlists to cater to varied musical preferences

• Personalized Music Experience: Develop customizable playlist features that allow users to create, save, and share their own music compilations

- Introduce a shared listening feature that enables users to listen to music together in real-time, enhancing the social aspect of music consumption

- Enable users to create their own music channels, upload their own music, and share it with the community, fostering user engagement and content sharing

• High-Quality Streaming and Offline Access:

- Provide high-quality audio streaming to ensure an optimal listening experience

- Implement offline listening capabilities, allowing users to download their favorite tracks and playlists for playback without an internet connection

- Incorporate secure and user-friendly payment systems to facilitate the purchase of premium features

- Offer a range of subscription plans and payment options to cater to different user needs and preferences

• Intuitive and Attractive User Interface:

- Design a clean, modern, and intuitive user interface that is easy to navigate and visually appealing

- Conduct user testing to gather feedback and make iterative improvements to the interface design

- Utilize machine learning to enhance the search engine, ensuring users receive accurate and relevant results based on their search queries

- Implement filtering and sorting options to help users easily find the music they are looking for

- Develop features that encourage user engagement, such as daily mixes, curated playlists, and personalized music recommendations

- Implement notification and reminder systems to keep users informed about new releases, upcoming events, and personalized suggestions

- Develop a scalable and maintainable application architecture that can handle a large number of users and data

- Ensure the application is optimized for performance, with fast load times and smooth operation across various Android devices

• Comprehensive Testing and Quality Assurance:

- Conduct thorough testing, including unit tests, integration tests, and user acceptance tests, to identify and resolve any bugs or issues

- Implement continuous integration and deployment practices to streamline the development process and ensure timely updates and improvements

- Provide detailed documentation for the application, including user guides, developer documentation, and API references

- Establish a support system to assist users with any issues or questions they may have, ensuring a positive user experience

By achieving these expected results and deliverables, THK Music will not only meet the functional requirements of a modern music streaming application but also deliver an exceptional user experience that fosters engagement, satisfaction, and loyalty among its users The project aims to set a new standard in the music streaming industry, combining advanced technology with user-centric design and innovative features.

Scientific and Practical Meaning

The development of THK Music holds both scientific significance and practical applications, contributing to the fields of technology, user experience design, and music consumption This section explores how the project advances scientific knowledge and its practical implications in real-world scenarios

1.6.1 Scientific Significance a User Experience Design:

• Interface Design and Usability: The iterative design process, including user feedback and usability testing, adds to the knowledge of effective user interface

28 design The lessons learned from this process can be applied to other applications to improve usability and user satisfaction

• Interactive Features: The development of features such as shared listening and user- generated channels explores new ways of social interaction within a digital environment, contributing to the understanding of social media dynamics and digital community building b User Behavior Analysis: Behavioral Insights: The data collected from user interactions with the application can be analyzed to gain insights into user behavior and preferences These insights can inform future research in human-computer interaction and user experience design

1.6.2 Practical Applications a Enhanced Music Consumption:

• Convenient Access: THK Music provides users with convenient access to a vast library of music, integrating multiple sources into a single application This enhances the user experience by reducing the need to switch between different music platforms

• Personalized Listening: The use of machine learning for personalized recommendations ensures that users receive music suggestions tailored to their preferences, making the listening experience more enjoyable and relevant b Social Interaction and Community Building:

• Shared Listening Experience: The feature that allows users to listen to music together in real-time fosters social interaction and community building This can enhance the sense of connection among users, making music consumption a shared and interactive experience

• User-Generated Content: By enabling users to create and share their own music channels, the application promotes user engagement and content creation This can help independent artists reach a wider audience and build their fan base c Economic Impact:

• Monetization Opportunities: The integration of e-commerce features for purchasing premium services provides a sustainable revenue model This not only supports the application's maintenance and development but also contributes to the broader digital economy

• Support for Artists: By providing a platform for artists to share their music, THK Music supports the music industry, particularly independent and emerging artists This can lead to new opportunities for monetization and exposure d Educational and Training Tool:

• Learning Platform for Developers: The project serves as a practical case study for students and developers learning about Android development, machine learning, and API integration The detailed documentation and development process can be used as an educational resource e User Empowerment: Features that allow users to upload and share their own music empower them to become content creators This can encourage creativity and provide a platform for self-expression

In conclusion, the development of THK Music has significant scientific and practical implications It advances knowledge in user experience design and user behavior analysis, while providing a valuable and engaging music streaming service for users The project not only enhances the way users consume music but also supports social interaction, economic growth, and education in the field of technology

TECHNOLOGIES AND LIBRARIES

Back-end

Node.js is a powerful and flexible server-side JavaScript runtime environment built on Google's V8 JavaScript Engine We chose Node.js because it offers high performance thanks to its non-blocking I/O and event-driven architecture, has a strong developer community, and provides the flexibility to use the same language for both frontend and backend development, optimizing the development process

For the framework, we chose Express.js, a lightweight and powerful web framework for Node.js Express.js provides a simple and understandable programming interface, allowing for quick setup and running of an HTTP server It easily integrates middleware and offers strong support for building RESTful APIs, which is a crucial aspect of our project In the project, we used Express.js to create routes and middleware for the application

Using Express.js has enabled us to achieve impressive performance, with the application capable of handling thousands of requests per second without issues, a clear and maintainable project structure, and the ability to quickly deploy new features thanks to strong community support and available libraries

We also used Socket.io to add real-time communication capabilities to our application Socket.io is a powerful library that simplifies the setup and management of WebSocket connections, enabling real-time bidirectional data transmission between the server and clients We chose Socket.io for its ease of use, robust support for real-time events, and its large developer community In the project, we used Socket.io to build features such as online chat and shared music listening Using Socket.io allowed us to provide a smooth and fast user experience, enabling real-time interactions without the need to reload the page Socket.io also offers automatic fallback mechanisms, ensuring stable connections even when WebSocket technologies are not fully supported

We also used Morgan to support logging HTTP requests during the development and operation of our application Morgan is a middleware for Express.js that allows logging detailed information about incoming HTTP requests to the server, including the request method, URL, response status, and response time We chose Morgan because it makes it easy to track and record requests, aiding in debugging and monitoring application performance In the project, we used Morgan to log requests and store them in log files for later analysis Using Morgan helped us quickly identify and fix issues, ensuring that the application runs smoothly and reliably

We also used Multer to handle file uploads in our application Multer is a middleware for Node.js that simplifies handling multipart/form-data, which is primarily used for uploading files We chose Multer because it is easy to use and integrates well with Express.js, allowing us to efficiently and securely handle file uploads In the project, we used Multer to implement features that allow users to upload documents and images Using Multer enabled us to manage and store uploaded files easily, ensuring that user data is processed safely and securely

We also used JWT (JSON Web Tokens) to manage user authentication in our application JWT is an open standard for creating digitally signed tokens to authenticate information between parties, commonly used for authentication and authorization in web applications We chose JWT because it simplifies authentication and securely manages user sessions efficiently In the project, we used JWT to create and authenticate tokens for login, authenticate requests from the client side, and authorize access to protected resources on the server Using JWT helped us build a flexible authentication system, allowing users to access resources securely and conveniently

We also integrated Stripe into our application to handle online payments flexibly and securely Stripe is a powerful online payment platform that provides tools and APIs to enable businesses to accept payments from customers worldwide Stripe offers easy integration, high flexibility, and reliable security In the project, we used Stripe to process mainly payment transactions, allowing users to utilize the Premium upgrade feature in our application Using Stripe has helped us increase convenience and trust for users, providing a smooth and secure online payment experience

We used Firebase Admin to manage and interact with the application's data from the server side Firebase Admin is a powerful toolkit from Firebase that allows us to perform data management operations such as reading, writing, and deleting data directly from the server We chose Firebase Admin for its flexibility and seamless integration with projects using Firebase in application development In the project, we used Firebase Admin to manage users, store data, and perform operations with Firebase database Using Firebase Admin helped us optimize the development process and efficiently manage the application's data

In our project, we leveraged Google APIs, specifically for integrating with Google

Drive to facilitate file storage Google Drive provides a reliable and scalable solution for storing various types of files securely in the cloud By utilizing Google APIs, we were able to seamlessly integrate our application with Google Drive, enabling users to upload, download, and manage files directly within our application This integration not only enhanced the user experience by providing a familiar and convenient file storage solution but also ensured data security and reliability, as Google Drive offers robust infrastructure and access controls Leveraging Google APIs for Google Drive integration empowered us to provide a seamless and feature-rich file storage experience for our users

We integrated Firebase Cloud Messaging (FCM) into our application to provide the feature of sending notifications to users on mobile devices FCM is a free messaging service from Google that allows us to send message notifications, specific alerts, or push notifications to users on Android and iOS platforms We chose FCM because it offers high performance, seamless integration with apps using Firebase, and robust support for customizing and tracking notifications In the project, we used FCM to send notifications to users about important events, updates of new songs, or notifications when THK has a new marketing campaign Using FCM helped us maintain connection with users, enhance interaction, and drive engagement in our application

Firebase Authentication offers easy-to-use authentication solutions that allow developers to authenticate users with minimal effort It provides various authentication methods such as email/password, phone number, social authentication (Google, Facebook, etc.), and more With Firebase Authentication, developers can quickly integrate secure

37 authentication into their apps without worrying about backend infrastructure It also offers features like user management, custom authentication, and integration with other Firebase services for a seamless development experience

Firebase Storage provides developers with a powerful and scalable solution for storing and serving user-generated content, such as images, videos, and other files It offers secure uploads and downloads, integrates seamlessly with Firebase Authentication for access control, and provides easy-to-use SDKs for various platforms

Front-end

2.2.1 Figma - Ui design a Introduction to Figma

Figma is a powerful design tool that is widely used for creating user interfaces (UI) and user experiences (UX) for web and mobile applications It is particularly well- suited for collaborative design projects due to its cloud-based nature, which allows multiple designers to work on the same project simultaneously This introduction will cover the key features of Figma and explain how it can be used effectively in the development of THK Music, our music streaming application

- Real-Time Collaboration: Figma allows multiple team members to work on the same design file in real-time, which enhances collaboration and reduces the need for constant file sharing

- Version Control: The platform maintains a history of changes, allowing designers to track revisions and revert to previous versions if needed

- Vector Networks: Figma provides advanced vector editing capabilities, allowing for precise and scalable designs

- Components and Styles: Designers can create reusable components and styles, ensuring consistency across the application’s UI

- Interactive Prototypes: Figma enables the creation of interactive prototypes that simulate the user experience, allowing for early testing and feedback

- Animations and Transitions: The tool supports the design of animations and transitions, which can enhance the overall user experience

- Third-Party Integrations: Figma integrates with various third-party tools and plugins, extending its functionality and allowing for a more streamlined design process

- Export Options: Designs can be easily exported in various formats, making it simple to share assets with developers b Using Figma for the project

In the development of THK Music, Figma plays a crucial role in ensuring that the application’s design is user-centric, intuitive, and visually appealing The following points highlight how Figma is utilized in this project:

- Team Coordination: The design team collaborates in real-time, which helps in maintaining a unified design vision and reduces miscommunication

- Stakeholder Feedback: Stakeholders can view the design progress and provide feedback directly on the platform, ensuring that the project meets business requirements and user needs

- Design System: A design system is established using Figma’s components and styles, ensuring that the UI elements are consistent across all screens

- Responsive Design: Figma’s responsive design capabilities allow the creation of layouts that adapt to various screen sizes, enhancing the user experience on different devices

- Interactive Prototypes: By creating interactive prototypes, the team can simulate the user journey and gather early feedback on the flow and functionality

- Usability Testing: Prototypes are used for usability testing sessions, providing valuable insights into user interactions and identifying areas for improvement

- Asset Export: Design assets are exported in formats that are easily used by developers, ensuring a smooth transition from design to development

- Design Specifications: Figma provides detailed design specifications that help developers implement the designs accurately c UI design on figma

After creating the wireframes, the next critical step in the design process is to develop the detailed user interface (UI) of the application This involves transforming the basic skeletal framework into a visually appealing and fully functional design Figma is an ideal tool for this phase due to its powerful features and collaborative capabilities

The Android SDK is a powerful development toolkit for Android mobile app developers This toolkit includes essential components such as compilers, libraries, emulators, and development support tools The compiler in the Android SDK translates Java source code into bytecode that runs on the Android platform The library comprises basic and support components like the Android Support Library, RecyclerView, ViewPager, and Fragment for developing user interfaces and app functionalities The emulator allows developers to test and debug apps on virtual Android devices on their computers Analytical and debugging tools such as Android Studio, Logcat, and Android Debug Bridge (ADB) aid in analysis, debugging, and monitoring app activities Development support tools like the Android SDK Manager, Android Virtual Device

Manager, and SDK Platform Tools assist in managing and configuring the SDK, handling virtual devices, and interacting with real devices

Gradle is a dependency management and build tool based on Apache Ant and

Apache Maven, widely used in Android app development It enables automation of the build process and management of project dependencies in a flexible manner Gradle employs a simple yet powerful syntax to define the project structure and build tasks It provides flexibility in customizing the build process through plugins and scripts

Retrofit, a robust HTTP client library for Android and Java applications, simplifies network requests and server response handling Its core features include handling various HTTP requests like GET, POST, PUT, and DELETE effortlessly through a straightforward API interface By utilizing annotations, Retrofit defines API endpoints and structures request and response data, minimizing complexity in crafting network requests The library supports multiple data format conversions, allowing seamless transformation between formats like JSON, XML, and Protocol Buffers With support for both synchronous and asynchronous calls, Retrofit provides flexibility and efficiency in network request handling Interceptors enable intervention in request and response processing, facilitating functionalities such as logging, authentication, and caching

Integrating RxJava3 into an Android project typically involves adding the RxJava dependency, defining observables and observers to handle data streams, and using operators to manipulate and process the data streams RxJava enhances the reactive programming paradigm in Android development, enabling cleaner, more concise, and more maintainable code for handling asynchronous tasks and data streams

OkHttp is a powerful HTTP client library for Android and Java, developed by Square, Inc This library provides robust features for sending network requests and handling server responses flexibly and efficiently.Key features of OkHttp include the ability to send various types of HTTP requests such as GET, POST, PUT, DELETE easily through a standardized API It also supports interceptors, allowing intervention in the process of sending and receiving network requests, facilitating functions like logging, authentication, compression, and caching flexibly.OkHttp utilizes connection pooling to optimize the management and reuse of network connections, enhancing performance and reducing latency The library also supports caching on both the client and server sides, enabling efficient storage and reuse of previously downloaded data

Gson is a Java library developed by Google for converting Java objects to JSON format and vice versa This library provides simple and flexible methods to perform this task easily and efficiently Gson allows automatic conversion of Java objects to JSON and vice versa, facilitating convenient creation and parsing of JSON data in Java applications

It also supports customization of the conversion process between JSON and Java objects using annotations and adapters, allowing adjustment of how Gson handles specific fields, objects, and data types Gson supports embedded data by converting linked objects to JSON and vice versa, enabling management of complex data in applications The library is optimized to ensure high performance and minimal resource consumption during the conversion process between JSON and Java objects

Glide is a powerful library for loading and displaying images in Android applications Developed by Google engineers, it offers a flexible and efficient solution for working with images Key features of Glide include automatic image loading and caching management to minimize response times and memory consumption It supports caching images in both memory and disk cache, optimizing image reloading and reducing network bandwidth usage Additionally, Glide allows for applying effects and animations to images, enhancing the user experience It provides flexible methods for customizing image loading and displaying, including options for adjusting image size, format, and quality

Palette is a library in Android developed by Google, allowing developers to extract primary and complementary colors from an image This library assists developers in creating attractive and engaging user interfaces by automatically selecting suitable colors based on the content of the image Palette provides features such as extracting primary and complementary colors from an image, automatically selecting appropriate colors, easy integration into Android applications, and support for effects and transitions in user interfaces

ExoPlayer is a powerful multimedia streaming library for Android, developed by

Google This library provides a flexible and robust way to play video and audio in Android applications, with high customization capabilities and support for advanced features such as streaming directly from online media sources ExoPlayer is designed to tackle complex streaming issues such as dealing with network fluctuations, efficient buffer management, and support for various media formats It offers features like dynamic quality video playback, DRM (Digital Rights Management) support, multi-channel audio playback, and more The ExoPlayer library also allows for integration of custom features such as subtitle display, playback controls, and flexible user interfaces It provides an easy-to-use API for

47 controlling and interacting with the media being played, allowing developers to create the best streaming experience for their users

React Router DOM is a popular library used for managing routing in React web applications This library provides components and APIs to create and manage routes within an application, allowing users to navigate between pages and display corresponding content based on the URL With React Router DOM, you can define routes based on URLs and render React components corresponding to each route It offers components such as BrowserRouter, Route, Switch, and Link to create routes and establish links between them React Router DOM enables you to build both multi-page and single-page web applications in React flexibly and manageably It's a powerful tool for creating dynamic and flexible user interfaces in React applications

Axios is a popular JavaScript library used for making HTTP requests from web browsers or Node.js applications It provides a simple and elegant API for performing asynchronous operations, such as sending HTTP GET, POST, PUT, and DELETE requests to a server and handling responses Axios supports features like request and response interceptors, allowing you to modify requests or responses globally or on a per-request basis It also includes built-in support for handling request and response data in various formats, such as JSON, FormData, and ArrayBuffer One of the key advantages of Axios is its ease of use and its promise-based API, which allows you to chain multiple asynchronous operations together using promises Additionally, Axios provides features

49 for canceling requests, handling errors, and setting up timeouts, making it a versatile and reliable choice for handling HTTP communication in JavaScript applications

SYSTEM DESIGN

System architecture

The system architecture for your mobile music application comprises three main components: the frontend, backend, and database Each component utilizes different technologies to ensure efficient development, scalability, and performance

Frontend Development a Web Frontend (ReactJS)

• ReactJS: A JavaScript library for building user interfaces, particularly single-page applications React allows developers to create reusable UI components

• HTML/CSS: The standard markup and styling languages used to create the structure and design of web pages

• JavaScript: The primary programming language used to implement the logic and functionality of the web application

• Axios: A promise-based HTTP client for making requests to the backend It simplifies the process of fetching data and handling responses

• AntDesign: A comprehensive UI component library for React It provides a wide range of pre-designed components that help speed up the development process and maintain design consistency b Mobile Frontend (Android SDK)

• Android SDK: The Software Development Kit for building Android applications

It provides tools, libraries, and documentation for developing apps on the Android platform

• XML: Used for designing the UI layout in Android applications XML allows developers to define the user interface elements in a structured format

• Java: The primary programming language used for Android development It is used to implement the business logic and functionality of the app

• RxJava: A library for reactive programming in Java It helps manage asynchronous data streams and event-based programs, making it easier to handle complex data flows and background tasks

• Retrofit: A type-safe HTTP client for Android and Java It simplifies the process of making network requests and handling responses, often used in conjunction with RxJava for efficient data fetching

• NodeJS: A JavaScript runtime built on Chrome's V8 engine It allows developers to use JavaScript for server-side scripting, enabling the creation of scalable backend services

• Firebase Admin: A module that provides admin SDKs for Firebase services It allows secure server-to-server interactions with Firebase features, such as authentication and real-time databases

• Express: A minimal and flexible Node.js web application framework It provides a robust set of features to build single-page, multi-page, and hybrid web applications

• Socket.io: A library that enables real-time, bidirectional, and event-based communication between the browser and the server It is commonly used for real- time features like chat applications and live updates

• Google API: APIs provided by Google that can be integrated into applications to access Google services, such as authentication, maps, and analytics

• Firestore: A NoSQL document-oriented database built for automatic scaling, high performance, and ease of application development Firestore is part of the Firebase platform and provides real-time synchronization and offline support for mobile and web applications

The combination of these technologies provides a robust and scalable architecture for your mobile music application ReactJS and AntDesign streamline web development, while the Android SDK and related libraries enhance mobile app functionality NodeJS, along with its associated frameworks and libraries, ensures efficient backend processing, and Firestore offers a reliable and real-time database solution

Use case diagram

Figure 31 User use case diagram

Figure 32 Admin Use Case Diagram

Use case specification

Use Case Name Play music

Short Description Users listen to the music they want

Post Condition Users can listen to the music they want

Main Flow 1 Select the song you listen to (a)

2 Users can listen to music, loops, and play randomly in the list

Alternative Flow In step (a), Users can add songs to queue, add to playlist, play next, like,

Table 1 Play music use case description

Use Case Name Explore music feed

Short Description Show suggested songs to the user

Post Condition Users can see the songs that the system suggests to them

Main Flow 1 User goes to "Home"

2 Users can listen to music, loops, and play randomly in the list

Alternative Flow In step (a), Users can add songs to queue, add to playlist, play next, like,

Table 2 Explore music feed use case description

Use Case Name Search music

Short Description User searches for songs, artists, or albums

Post Condition Users can search and the system returns results based on the items that the user selects "All", "Song", "Artist", "Album" Main Flow 1 Users go to the home page

2 Click on the "find" icon

3 The search page appears and the user enters a keyword to search (a)

4 Based on the search keyword, the system will return results (e1)

Alternative Flow In step (a), users can filter their search results by clicking on

Exception Flow In step (e1), if no results are found, the system will display the message "No result return"

Table 3 Search music feed use case description

Use Case Name Sign up

Short Description User registers an account

Post Condition Users can register and receive an account confirmation email

Main Flow 1 Select "Profile" in the bottom navigation bar

4 Fill in your username, email address and password

6 The system will take the user to the account confirmation page

7 The user opens the email, clicks on the account confirmation link

8 Then the user can be typing (e2) Alternative Flow

Exception Flow In step (e1), if the user enters an email that does not exist or the email is already registered, the message "Login fail" will be displayed

In step (e2), if the user logs in without confirming the email, it will not be able to log in and will display the message

Table 4 Sign up use case description

Short Description User logs in to the system

Post Condition Users can log in to the system from the registered account or continue with the gmail account Main Flow 1 Select "Profile" in the bottom navigation bar

4 Fill in the email address and password (a1) (a2) (a3)

6 The system will take the user to the Home page Alternative Flow In step (a1), Users can also choose to log in by "Continue with gmail"

In step (a2), Users can save the account and do not need to log in the next time by ticking "Remember me"

In step (a3), If the user forgets the password, they can also click on "I forgot my password" to receive a new password Exception Flow In step (e1), if the user enters the wrong information, the message "Email or password wrong" will be displayed

Table 5 Login use case description

Use Case Name Join Music Party

Short Description Users can enter the shared music room

Pre-Condition Logged-in User

Post Condition Users can enter the interactive room and listen to music with other users

Main Flow 1 Select "Corner" in the bottom navigation bar

4 The system brings users into the common room

Exception Flow In step (e), if the user enters the wrong room ID, the message

"Wrong Friend's ID" will be displayed

Table 6 Join music party use case description

Use Case Name Upgrade Premium

Short Description User upgrades to premium

Pre-Condition Logged-in User

Post Condition Users can upgrade to premium

Main Flow 1 Select "Profile" in the bottom navigation bar

2 Select the "Premium" view card

3 The payment system will appear

5 After successful payment, users can use premium features Alternative Flow

Exception Flow In step (e), if the payment fails, the message "Payment failed" will appear

Table 7 Upgrade premium use case description

Use Case Name Config profile

Short Description User changes user information

Pre-Condition Logged-in User

Post Condition Users can update and change their information

Main Flow 1 Users go to the "Profile" page

3 The profile editing page will appear and the user can change the username, avatar (a)

Alternative Flow In step (a), if the user logs in with an account (not through a gmail account), it will be possible to change the password After clicking "Change", a password change message will be sent to the email

Table 8 Config profile use case description

Use Case Name Browse History Song

Short Description Users view their music listening history

Pre-Condition Logged-in User

Post Condition Users can see and listen to the songs they have listened to

Main Flow 1 Users go to the "Profile" page

3 The system will display a list of lists that the user has listened to (a)

Alternative Flow In step (a), if the user does not have a history, it will show

Table 9 Browse history song use case description

Use Case Name Browse Downloads Song

Short Description Users view the songs they have downloaded

Pre-Condition Logged-in User

Main Flow 1 Users go to the "Profile" page

2 Click on the card view "Download Song"

3 The system will display a list of downloaded songs Alternative Flow

Table 10 Browse downloads song use case description

Use Case Name Browse Love Song

Short Description Users watch songs that they have liked

Pre-Condition Logged-in User

Post Condition Users can view and listen to the songs they like

Main Flow 1 Users go to the "Profile" page

3 The system will bring up a list of lists that the user has liked (a)

Alternative Flow In step (a), if the user does not have a history, it will show

Table 11 Browse love song use case description

Use Case Name Load Song From Your Storage

Short Description Users can upload songs from their computers to the app Pre-Condition

Post Condition Users can view and listen to songs under local

Main Flow 1 Users go to the "Library" page

2 The system will bring up a list of song lists under local (a)

Table 12 Load song from your storage use case description

Use Case Name Downloads Music

Short Description User downloads music to the machine

Pre-Condition Logged-in User

Post Condition Users can download music to the machine

Main Flow 1 Users click on the "More" icon of the song they want to download

3 The system will download the song to the user's computer Alternative Flow

Table 13 Download music use case description

Use Case Name Create Music Party

Short Description Users can create a shared music room

Pre-Condition Users who have upgraded to Premium

Post Condition Users can create a shared music room

Main Flow 1 Users go to the "Corner" page

3 The system brings users into the room

Table 14 Create music party use case description

Use Case Name View Users

Short Description Admin can view the list of Users

Post Condition User list was loaded successfully

Main Flow 1 Click the User button in the sidebar

2 List of Users loaded successfully (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the User list will not be loaded

Table 15 View users use case description

Use Case Name Update User

Short Description Admin can edit User information

Post Condition User information was successfully edited

Main Flow 1 Click the Edit button in the User that the admin wants to edit

2 A form is displayed with the User's current information

4 Click the update button to update User information (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the User's information will not be updated

Table 16 Update user use case description

Use Case Name Delete User

Short Description Admin can delete any User

Post Condition User was deleted successfully

Main Flow 1 Click the Delete button on the User that the admin wants to delete

2 User was successfully deleted (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the User will not be deleted

Table 17 Delete user use case description

Use Case Name View Songs

Short Description Admin can view the list of Songs

Post Condition Song list was loaded successfully

Main Flow 1 Click the Song button in the sidebar

2 List of Songs loaded successfully (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the Song list will not be loaded

Table 18 View songs use case description

Use Case Name Create Song

Short Description Admin can create new Song

Post Condition Song was created successfully

Main Flow 1 Click the Add Song button

2 Fill in the necessary information for Song

4 The song was created successfully Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, he will not be able to create a new Song

Table 19 Create song use case description

Use Case Name Update Song

Short Description Admin can edit Song information

Post Condition Song information was successfully edited

Main Flow 1 Click the Edit button in the Song that the admin wants to edit

2 A form is displayed with the Song’s current information

4 Click the update button to update Song information (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the Song’s information will not be updated

Table 20 Update song use case description

Use Case Name Delete Song

Short Description Admin can delete any Song

Post Condition Song was deleted successfully

Main Flow 1 Click the Delete button on the Song that the admin wants to delete

2 Song was successfully deleted (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the Song will not be deleted

Table 21 Delete song use case description

Use Case Name View Artists

Short Description Admin can view the list of Artists

Post Condition Artist list was loaded successfully

Main Flow 1 Click the Artist button in the sidebar

2 List of Artists loaded successfully (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the Artist list will not be loaded

Table 22 View artists use case description

Use Case Name Create Artist

Short Description Admin can create new Artist

Post Condition Artist was created successfully

Main Flow 1 Click the Add Artist button

2 Fill in the necessary information for Artist

4 The Artist was created successfully Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, he will not be able to create a new Artist

Table 23 Create artist use case description

Use Case Name Update Artist

Short Description Admin can edit Artist information

Post Condition Artist information was successfully edited

Main Flow 1 Click the Edit button in the Artist that the admin wants to edit

2 A form is displayed with the Artist’s current information

4 Click the update button to update Artist information (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the Artist’s information will not be updated

Table 24 Update artist use case description

Use Case Name Delete Artist

Short Description Admin can delete any Artist

Post Condition Artist was deleted successfully

Main Flow 1 Click the Delete button on the Artist that the admin wants to delete

2 Artist was successfully deleted (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the Artist will not be deleted

Table 25 Delete artist use case description

Use Case Name View Genres

Short Description Admin can view the list of Genres

Post Condition Genre list was loaded successfully

Main Flow 1 Click the Genre button in the sidebar

2 List of Genres loaded successfully (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the Genre list will not be loaded

Table 26 View genres use case description

Use Case Name Create Genre

Short Description Admin can create new Genre

Post Condition Genre was created successfully

Main Flow 1 Click the Add Genre button

2 Fill in the necessary information for Genre

4 The Genre was created successfully Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, he will not be able to create a new Genre

Table 27 Create genre use case description

Use Case Name Update Genre

Short Description Admin can edit Genre information

Post Condition Genre information was successfully edited

Main Flow 1 Click the Edit button in the Genre that the admin wants to edit

2 A form is displayed with the Genre’s current information

4 Click the update button to update Genre information (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the Genre’s information will not be updated

Table 28 Update genre use case description

Use Case Name Delete Genre

Short Description Admin can delete any Genre

Post Condition Genre was deleted successfully

Main Flow 1 Click the Delete button on the Genre that the admin wants to delete

2 Genre was successfully deleted (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the Genre will not be deleted

Table 29 Delete genre use case description

Use Case Name View Albums

Short Description Admin can view the list of Albums

Post Condition Album list was loaded successfully

Main Flow 1 Click the Album button in the sidebar

2 List of Albums loaded successfully (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the Album list will not be loaded

Table 30 View albums use case description

Use Case Name Create Album

Short Description Admin can create new Album

Post Condition Album was created successfully

Main Flow 1 Click the Add Album button

2 Fill in the necessary information for Album

4 The Album was created successfully Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, he will not be able to create a new Album

Table 31 Create album use case description

Use Case Name Update Album

Short Description Admin can edit Album information

Post Condition Album information was successfully edited

Main Flow 1 Click the Edit button in the Album that the admin wants to edit

2 A form is displayed with the Album’s current information

4 Click the update button to update Album information (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the Album’s information will not be updated

Table 32 Update albm use case description

Use Case Name Delete Album

Short Description Admin can delete any Album

Post Condition Album was deleted successfully

Main Flow 1 Click the Delete button on the Album that the admin wants to delete

2 Album was successfully deleted (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the Album will not be deleted

Table 33 Delete albums use case description

Use Case Name View Notifications

Short Description Admin can view the list of Notifications

Post Condition Notification list was loaded successfully

Main Flow 1 Click the Notification button in the sidebar

2 List of Notifications loaded successfully (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the Notification list will not be loaded

Table 34 View notifications use case description

Use Case Name Create Notification

Short Description Admin can create new Notification

Post Condition Notification was created successfully

Main Flow 1 Click the Add Notification button

2 Fill in the necessary information for Notification

4 The Notification was created successfully Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, he will not be able to create a new Notification

Table 35 Create notification use case description

Use Case Name Delete Notification

Short Description Notification can delete any Album

Post Condition Notification was deleted successfully

Main Flow 1 Click the Delete button on the Notification that the admin wants to delete

2 Notification was successfully deleted (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the Notification will not be deleted

Table 36 Update notification use case description

Use Case Name View Banners

Short Description Admin can view the list of Banners

Post Condition Banner list was loaded successfully

Main Flow 1 Click the Banner button in the sidebar

2 List of Banners loaded successfully (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the Banner list will not be loaded

Table 37 View banners use case description

Use Case Name Create Banner

Short Description Admin can create new Banner

Post Condition Banner was created successfully

Main Flow 1 Click the Add Banner button

2 Fill in the necessary information for Banner

4 The Banner was created successfully Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, he will not be able to create a new Banner

Table 38 Create banner use case description

Use Case Name Update Banner

Short Description Admin can edit Banner information

Post Condition Banner information was successfully edited

Main Flow 1 Click the Edit button in the Banner that the admin wants to edit

2 A form is displayed with the Banner’s current information

4 Click the update button to update Banner information (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the Banner’s information will not be updated

Table 39 Update banner use case description

Use Case Name Delete Banner

Short Description Admin can delete any Banner

Post Condition Banner was deleted successfully

Main Flow 1 Click the Delete button on the Banner that the admin wants to delete

2 Banner was successfully deleted (e1) Alternative Flow

Exception Flow In step (e1), if the admin loses the token or the network is unstable, the Banner will not be deleted

Table 40 Delete banner use case description

Use Case Name Login Admin

Short Description Admin logs in to the Admin website

Post Condition Admin logged in successfully

Main Flow 1 Access THK Music's web admin

2 Fill in username and password

4 Redirect to the web admin's home page

Exception Flow In step (e1), if the user enters incorrect information, the message "Email or password wrong" will appear

Table 41 Login admin use case description

Class Diagram

This class diagram represents the architecture of a mobile music application It outlines the relationships and interactions between various components of the app, including users, songs, artists, playlists, and the services managing these entities

▪ title: String: The title of the song

▪ artist: Artist: The artist who performed the song

▪ duration: long: The duration of the song in milliseconds

▪ album: Album: The album the song belongs to

▪ thumbnail: byte[]: The thumbnail image of the song

▪ songUrl: String: The URL to stream the song

▪ genres: List: The genres the song belongs to

▪ view: int: The number of views the song has

▪ name: String: The name of the artist

▪ singles: List: The list of singles by the artist

▪ albums: List: The list of albums by the artist

▪ imageUrl: String: The image URL of the artist

▪ introduction: String: A brief introduction about the artist

▪ artist: String: The name of the artist who released the album

▪ imageUrl: String: The image URL of the album

▪ listSong: List: The list of songs in the album

▪ name: String: The name of the album

▪ username: String: The username of the user

▪ password: String: The password of the user

▪ role: String: The role of the user (e.g., admin, regular user)

▪ email: String: The email of the user

▪ premiumExpiredDate: Date: The expiration date of the premium membership

▪ signInMethod: String: The sign-in method (e.g., email, Google)

▪ imageUrl: String: The profile image URL of the user o Methods:

▪ loginWithEmailPassword(): Method for logging in with email and password

▪ logOut(): Method for logging out

▪ upGradePremium(): Method for upgrading to premium

▪ loginWithGoogleMail(): Method for logging in with Google

▪ downgradePremium(): Method for downgrading from premium

▪ name: String: The name of the playlist

▪ songs: List: The list of songs in the playlist

▪ songs: List: The list of songs in the library

▪ playlist: List: The list of playlists in the library

▪ user: User: The user who listened to the song

▪ song: Song: The song that was listened to

▪ count: int: The number of times the song was listened to

▪ isLoved: boolean: Indicates if the user loved the song

▪ lastListen: date: The last time the song was listened to

▪ user: User: The user who performed the search

▪ history: List: The search history of the user

▪ type: String: The type of result (e.g., song, artist)

▪ data: Object: The result data

▪ clientSecret: String: The client secret for the payment

▪ amount: float: The amount of the payment

▪ type: String: The type of payment o Methods:

▪ fetchingPaymentInfo(float, String): Method for fetching payment information

▪ title: String: The title of the advertisement

▪ description: String: The description of the advertisement

▪ imageUrl: String: The image URL of the advertisement

▪ clickUrl: String: The URL to click on the advertisement

▪ expirationDate: Date: The expiration date of the advertisement

▪ getSongs(): Retrieves a list of songs

▪ getAllNameInfoSong(): Retrieves a list of song names

▪ addUser(User): Adds a new user

▪ getUserById(String): Retrieves user information by ID

▪ getUserListenHistory(String): Retrieves the listen history of a user

▪ addUserListenHistory(ListenHistory): Adds a listen history entry

▪ addSearchHistory(String, String): Adds a search history entry

▪ getSearchHistoryById(String): Retrieves search history by ID

▪ getBanners(): Retrieves a list of advertisements

▪ getUserLoveSong(String): Retrieves the loved songs of a user

▪ getUserRecentSong(String): Retrieves the recent songs of a user

▪ upgradePremium(String, Payment): Upgrades a user to premium

▪ downgradePremium(String): Downgrades a user from premium

▪ updateUserProfile(User): Updates a user's profile

▪ getUserLovedSong(String): Retrieves the loved songs of a user

▪ getUserRecentSong(String): Retrieves the recent songs of a user

▪ Queue: List: The queue of songs

▪ RepeatMode: enum: The repeat mode

▪ isShuffle: boolean: Indicates if shuffle is enabled o Methods:

▪ addMediaItem(Song): Adds a song to the queue

▪ setMediaItem(Song): Sets the current song

▪ changeRepeatMode(String): Changes the repeat mode

▪ seekToMediaItem(int): Seeks to a specific song in the queue

▪ seekToPosition(long): Seeks to a specific position in the current song

▪ setShuffle(boolean): Enables or disables shuffle

▪ skipToNext(): Skips to the next song

▪ skipToPrevious(): Skips to the previous song

▪ socket: Socket: The socket connection

▪ gsonConverter: Gson: The JSON converter o Methods:

▪ onJoinRoom(String, String): Joins a room

▪ onAddSong(Song): Adds a song to the room

▪ onUserChat(String, String): Sends a chat message

▪ onSeekSong(long): Seeks to a specific position in the song

▪ onPrevious(): Plays the previous song

▪ doInBackGround(): Downloads a song in the background

▪ onMessageReceived(RemoteMessage): Handles received messages

▪ sendNotification(Song, String, String, int[]): Sends a notification

▪ name: String: The name of the music room

▪ currentSong: Song: The current song playing in the room

▪ playList: List

Ngày đăng: 19/11/2024, 12:24

TÀI LIỆU CÙNG NGƯỜI DÙNG

TÀI LIỆU LIÊN QUAN

w