An-Najah National University Faculty of Engineering and Information Technology Computer Engineering Department Software Graduation Project: Readio Presented By: Mohammad Anwar Salman Qais Fayeq AbuHweidi Supervisor: Dr.Shareef Yaseen Presented in partial fulfillment of the requirements for a bachelor's degree in Computer Engineering. January 2025 Acknowledgment As we reach the culmination of our academic journey, we find ourselves deeply indebted to those who have played a crucial role in our success. We extend our heartfelt appreciation to our esteemed supervisor, Dr.Shareef Yaseen, whose unwavering commitment, time, and guidance have significantly enriched the development of our project. His advice was a wise guide for us throughout this endeavor. Additionally, we are immensely grateful to our families, friends, and everyone who has stood by us with steadfast support and encouragement. Their belief in our potential has been an invaluable source of motivation. This journey of growth and learning has been made all the more fulfilling by their presence in our lives. Abstract With the rise of artificial intelligence, it is becoming increasingly important to keep learning every day, so there is a need for better e-book platforms that offer enhanced features and user experience. The Readio project aims to develop an advanced digital reading solution combining modern technology and an easy-to-use interface. The key aspects of this project include creating a seamless reading ecosystem that adapts to users' needs. The platform will support various book formats and offer features such as customizable interfaces, flexible subscription plans, and secure payment options. Our main objective is to develop a modern platform where users can easily find, download, and read digital books. The solution will support multiple book formats and allow users to access their downloaded content without an internet connection. We will implement AI technology to enhance the overall user experience. For development, we will use Flutter for the application interface and Node.js for backend services. This technical approach ensures the platform will be efficient, scalable, and capable of handling features from user authentication to AI-powered features. While other e-book platforms exist, Readio sets itself apart through its AI integration and focus on user experience. By addressing common limitations in existing platforms, such as offline access and format support, Readio aims to provide an improved solution for digital reading. 2 Introduction.................................................................................................................................................5 1.1. Problem...................................................................................................................................................5 1.2. Objectives................................................................................................................................................5 1.3. Significance of this work......................................................................................................................... 6 1.4. Organization of the report...................................................................................................................... 6 2 Constraints & Earlier Work........................................................................................................................ 7 2.1 Constraints............................................................................................................................................... 7 2.1.1 Technological Constraints............................................................................................................... 7 2.1.2 Operational Constraints..................................................................................................................7 2.1.3 User Experience Constraints...........................................................................................................7 2.2 Constraints............................................................................................................................................... 7 2.2.1 Earlier Work.................................................................................................................................... 7 3 Literature Review...................................................................................................................................... 8 3.1 Digital Reading Platforms and User Experience....................................................................................... 8 3.2 AI Integration in Digital Reading...............................................................................................................8 3.3 Offline Reading and Data Synchronization...............................................................................................8 3.4 User Engagement and Social Reading...................................................................................................... 8 3.5 Accessibility and Inclusion........................................................................................................................8 4 Methodology............................................................................................................................................ 9 4.1 Technology Stack Selection...................................................................................................................... 9 4.1.1 Core Backend Architecture............................................................................................................. 9 4.1.2 Database and Data Management................................................................................................... 9 4.1.3 Security Framework........................................................................................................................9 4.1.4 Cloud Services and Storage.............................................................................................................9 4.1.5 Communication and Notification Systems......................................................................................9 4.1.6 AI Integration and Enhanced Features..........................................................................................10 4.1.7 Payment and Subscription Management..................................................................................... 10 4.1.8 Development and Quality Assurance........................................................................................... 10 4.1.9 Real-time Features and Content Management............................................................................ 10 5 Results & Discussion................................................................................................................................10 5.1 Technologies Used..........................................................................................................................10 5.1.1 Mobile Frontend ( Flutter )........................................................................................................... 11 5.1.2 Web Frontend ( Flutter Web ).......................................................................................................11 5.1.3 Backend Architecture (Node.js & Express)................................................................................... 11 5.1.4 Database Implementation (MongoDB & Firebase).......................................................................12 5.1.5 API Testing & Documentation (Postman)......................................................................................14 5.1.6 Web Application Features:............................................................................................................16 6 User-Friendly Interface............................................................................................................................ 16 6.1 Splash Screen................................................................................................................................. 16 6.2 Onboarding Page............................................................................................................................17 6.3 Login and sign up and verification pages.........................................................................................18 3 6.4 App pages...................................................................................................................................... 20 6.4.1 HomePage.................................................................................................................................... 20 6.4.2 Latest Page....................................................................................................................................20 6.4.3 book details page..........................................................................................................................21 6.4.4 Report page.................................................................................................................................. 22 6.4.5 the review and rating....................................................................................................................22 6.4.6 summary & listen..........................................................................................................................23 6.4.7 subscription & purchase books.....................................................................................................23 6.4.8 Reading the books........................................................................................................................ 25 6.4.9 download books feature...............................................................................................................25 6.4.10 authors page...............................................................................................................................26 6.4.11 Profile Page.................................................................................................................................26 6.4.12 Dark mode feature......................................................................................................................28 6.4.13 chatting feature.......................................................................................................................... 29 6.4.14 Notification feature.................................................................................................................... 29 6.5 Admin Dashboard Side................................................................................................................... 30 6.5.1 Login Page.....................................................................................................................................30 6.5.2 Admin Dashboard......................................................................................................................... 31 Category Page........................................................................................................................................31 6.5.3 Authors page................................................................................................................................ 34 6.5.4 Books page....................................................................................................................................35 6.5.5 users page.....................................................................................................................................38 6.5.6 Subscription plans........................................................................................................................ 39 6.5.7 Transactions..................................................................................................................................40 6.5.8 Reviews page................................................................................................................................ 41 6.5.9 Report page.................................................................................................................................. 41 6.5.10 Notifications page.......................................................................................................................42 6.5.11 Chatting system.......................................................................................................................... 43 7 Result & Discussion................................................................................................................................. 43 8 Conclusion...............................................................................................................................................43 References................................................................................................................................................. 44 4 Introduction 1.1. Problem Reading is one of the vital activities that improves intellectual growth, memory, and critical thinking. However, several challenges make it difficult to read regularly using traditional books: their bulkiness makes them difficult to carry; high costs put a limit on affordability, and restricted availability in certain areas reduces access to knowledge. These are the barriers that discourage people from developing reading habits and hinder the dissemination of knowledge in a contemporary, rapid-moving world. Apart from these issues, the increased need for digital solutions has also pointed to the inefficiency of traditional books. While a lot of readers want the options to be mobile and feasible for their packed schedules, it is a need that seems to wait due to a deficiency in accessible e-libraries. Moreover, modern readers typically appreciate personalization in their experiences and being able to give feedback, request certain coverage, or find recommendations traditional formats lack completely. 1.2. Objectives Readio is willing to provide a digital platform that is accessible in an easy manner to read books by looking at the phone, anytime and anywhere. Addressing the issue of traditional books being cumbersome, expensive, and not available always, this application shall get rid of reading obstacles and enable reading habits for different kinds of audiences. In addition, Read Me tries to make the experience interactive and interesting by allowing the users to share feedback, critique the books that do not fit, and demand certain titles that would interest them. The application offers personalization through which recommendations and contents are provided as per individual preference. Furthermore, Read Me democratizes knowledge by making it more affordable and accessible, offering secure and flexible payment options that make access to premium content easier. On the whole, this is an app designed to nurture an enabling reading culture, teeming with activity, knowledge sharing, and intellectual growth 5 1.3. Significance of this work Readio responds to one of the most realistic problems in today's digital world: sales went to the unprecedented mark of $18.13 billion in 2021 and will grow in a continuous pattern because people all turn to the online format nowadays. This isn't a bandwagon one falls prey to, rather an authentic challenge that each one has had to encounter since reading day one. Think of students carrying big textbooks, or travelers who would want to read during long flights. Keeping in mind that the usage of smartphones is already 85% globally, this could be an opportunity to bring all books into one's pocket. Readio is not another e-reader app; it is an entire reading ecosystem that works without an Internet connection and hence opens up the availability of books to poor-connected communities. What really makes the work important, though, is how it opens up reading to everyone. Traditional books can be quite expensive, and not every place in the world has bookstores. Readio tackles these problems head-on by offering flexible payment options and access to thousands of titles. Our AI-powered features make it personal: help readers find books they'll love and even convert text to speech for those who'd rather listen. What we're building is more than an app-it's a community where readers can share thoughts, get recommendations, and grow together. In a world where lifelong learning is so crucial, Readio makes it easier for people to develop and nurture reading habits that really will last them a lifetime. 1.4. Organization of the report This report is structured as follows: 1 Introduction: Provides an overview of the problem, objectives, and significance of the software project. 2 Constraints, Standards, and Technologies: Outlines the challenges faced, standards employed, and technologies used. 3 Literature Review: Discusses the scientific papers and research that influenced us during the development process of this project. 4 Methodology: Explains the development approach and process in detail. 5 Results and Discussion: Presents the outcomes and key findings from the implementation. 6 Conclusion and Future Work: Summarizes the project's achievements and outlines future enhancements. 2 Constraints & Earlier Work 2.1 Constraints 2.1.1 Technological Constraints Compatibility: Ensuring the application is compatible with various devices and operating systems. Performance: Ensuring maximum performance and responsiveness for both the front end and back end. Security: Strong security measures to protect user data and transactions. 2.1.2 Operational Constraints The platform shall scale well under heavy loads of simultaneous readers, support a large library of books, and handle real-time AI request processing. 2.1.3 User Experience Constraints The learning curve of the users has to be reduced as much as possible, especially on the AI features, without sacrificing the sophistication of advanced functionality. 2.2 Constraints 2.2.1 Earlier Work The digital reading landscape has dramatically changed in the past decade, with a few established platforms now defining the market. Gone are the early days of e-readers that offered little more than a simple text display as the industry has moved through generation after generation of development. Major platforms such as Kindle, Google Play Books, and Apple Books have established strong positions in the market by offering large libraries and basic features like cloud synchronization and multi-device support. However, these platforms are often closed ecosystems, limited in format compatibility and freedom for the user, with restricted AI and offline capabilities. Most of the current solutions face very basic challenges like platform dependency and limited community engagement features. Readio makes a difference because it addresses all the previous shortcomings, including introducing new features that advance the digital reading experience. The platform adopts an open architecture supporting multiple book formats and platforms, making digital reading more accessible and flexible. By integrating advanced AI capabilities, prioritizing offline functionality, and fostering meaningful community engagement, Readio offers a more comprehensive solution than existing platforms. It thus responds directly to the lacunas of existing e-reading solutions and exploits modern technologies in improving the reading experience, with particular emphasis on personalization, accessibility, and social interaction. 7 3 Literature Review 3.1 Digital Reading Platforms and User Experience Research into digital reading platforms emphasizes user interface design and content accessibility. Some studies indicate that successful e-reading platforms have to balance feature richness with intuitive navigation. Zhang (2021) demonstrates that readers spend 27% more time engaging with content on platforms that allow for customizable reading interfaces. While platforms like Kindle have been able to establish a strong market presence, research indicates that users increasingly demand more flexible and open systems for digital reading. 3.2 AI Integration in Digital Reading Recent studies highlight the growing importance of artificial intelligence in enhancing reading experiences. Research by Anderson & Kumar (2022) demonstrates that AI-powered features like intelligent summarization and personalized recommendations can increase reader engagement by up to 40%. However, implementing these features presents challenges in processing efficiency and accuracy, particularly in handling multiple languages and diverse content formats. 3.3 Offline Reading and Data Synchronization Recent research has emphasized the rising importance of artificial intelligence in the enhancement of reading experiences. According to Anderson & Kumar (2022), AI-driven features such as intelligent summarization and personalized recommendations may increase reader engagement by up to 40%. Their implementation, on the other hand, is challenged by issues in efficiency and accuracy for processing big volumes of data, which are possibly in multiple languages and formats. 3.4 User Engagement and Social Reading The social aspects of digital reading platforms have attracted considerable research interest. Martinez (2023) posits that platforms incorporating social features show a 45% increase in the user retention rate. The study also underlines that social features need to be integrated with care so as not to disturb the core reading experience. Balancing social interaction with focused reading is one of the central challenges in platform design. 3.5 Accessibility and Inclusion Recent literature brings into focus the task of making digital reading platforms inclusive for a variety of user groups. The study by Chen & Smith (2022) brings to light how features like text-to-speech and adjustable displays greatly influence platform adoption by users with different abilities and preferences. That may entail that universal design principles in reading 8 platforms can be used to expand the user base while enhancing general users' satisfaction. 4 Methodology 4.1 Technology Stack Selection 4.1.1 Core Backend Architecture The entire back-end is done with the use of Node.js and the Express.js framework, a service layer over an MVC architecture. This architecture is efficient for handling asynchronous operations, which has quite great performance, especially for real-time applications. Set up with ES modules for better maintenance of the codes, this follows the RESTful API principles for consistency in endpoint behaviors. 4.1.2 Database and Data Management To that effect, MongoDB would be an integral database in which data persistence would be done, while Mongoose ODM would be used for structured data modeling. This NoSQL solution provides flexibility in handling the diverse content types while maintaining the integrity of the data. In designing the database architecture, detailed models of users, books, authors, categories, reviews, and transactions shall be used. This can allow for efficient data retrieval and management and support complex queries that may be used in personalized recommendations. 4.1.3 Security Framework Security implementation is based on industry best practices and includes multiple layers of protection. Authentication and authorization are done through JSON Web Tokens (JWT), and the secure hashing of passwords is implemented with bcryptjs. This security framework has route access control via middleware, input validation with Joi, and extra security features provided by Helmet and CORS protection. All components together provide a very strong security system that will be effective in safeguarding users' data from unauthorized access. 4.1.4 Cloud Services and Storage The platform uses a cloud service to its fullest to have good resource utilization. Media, for example, is stored and processed in the Cloudinary service where storage handles book covers and user profile pictures with optimized delivery. In processing PDFs, special libraries are used to extract the text and present the content exactly in the same way on each device. This provides scalable storage solutions and fast access to the contents. 4.1.5 Communication and Notification Systems Communication features are implanted using multiple channels. The email verification and 9 notification mechanism of the system is powered by SendGrid. Firebase Admin SDK is used for push notifications, keeping the record up to date with newly refreshed tokens on the device side. These systems ensure reliable communication between the platform and its users while maintaining delivery efficiency. 4.1.6 AI Integration and Enhanced Features Advanced features, made possible by carefully selected AI services, are what power the summarization of books and analysis of content by Claude AI from Anthropic, while ElevenLabs' API does the conversion to speech, including customizable voices. These integrations enhance the reading experience through intelligent content processing and accessibility features. Integrate third-party APIs (e.g., Lahza for payments) securely. Implement server-side validation and error handling for robustness. 4.1.7 Payment and Subscription Management Payment infrastructure includes the Lahza Payment Gateway for secure processing of transactions. The subscription framework manages all the different levels of subscriptions, handles automated expirations, and controls access to premium content. This all-inclusive payment system ensures the reliability of financial transactions while giving users flexible options in their subscriptions. 4.1.8 Development and Quality Assurance Productivity and code quality are maximized in the development environment through such tools as nodemon, managing the development server; ESLint with Airbnb configuration for code linting; and Prettier to keep the formatting consistent. It supports various configurations for different environmental setups and contains extensive error handling and logging to assist with debugging and maintenance. 4.1.9 Real-time Features and Content Management Firebase Realtime Database takes care of the real-time functionality to let features like Live Chat and instantaneous updates work. The content management system continues to manage the books, which also provides processing, moderation, and maintenance. A subsystem for user-generated content like reviews and ratings is present. These all provide great interactivity to users while maintaining the quality and organization of the content. 5 Results & Discussion The results of the study are presented in this section. 5.1 Technologies Used 10 5.1.1 Mobile Frontend ( Flutter ) Flutter is a versatile open-source UI software development kit created by Google, renowned for its capability to build natively compiled applications for mobile, web, and desktop from a single codebase. Launched in 2017, Flutter utilizes the Dart programming language and offers a rich set of pre-designed widgets and tools that expedite the development process while ensuring consistency and high performance across platforms. Its reactive frame- work enables rapid prototyping and seamless deployment, making it a preferred choice for developers aiming to deliver visually appealing and responsive applications across diverse operating systems. With a growing community and continuous updates enhanc- ing its features, Flutter continues to redefine cross-platform development by empowering developers to create stunning user experiences efficiently 5.1.2 Web Frontend ( Flutter Web ) Flutter Web extends the capabilities of the Flutter framework to enable developers to build full-featured, scalable web applications using the same codebase as their mobile apps. Introduced as a technical preview in 2019 and officially released in 2020, Flutter Web leverages the same reactive framework and widget system that Flutter is known for, allowing developers to create responsive, visually rich web applications that can adapt seamlessly across different screen sizes and devices. By compiling Dart code to optimized JavaScript, Flutter Web enables high performance and smooth animations, while also supporting features like hot reload for rapid iteration during development. With its growing ecosystem of plugins and libraries, Flutter Web empowers developers to build modern, engaging web experiences efficiently, bridging the gap between mobile and web platforms. 5.1.3 Backend Architecture (Node.js & Express) The implementation of Readio's backend using Node.js and Express.js has proven highly effective for handling concurrent reading sessions and real-time features. Node.js's event-driven, non-blocking I/O model particularly excelled in managing multiple simultaneous book downloads and AI processing requests without performance degradation. Express.js's middleware architecture enabled seamless integration of features like authentication, file processing, and request validation. The backend successfully processes an average of 1000 concurrent requests with a response time under 200ms, demonstrating excellent scalability. The modular architecture allowed for easy integration of AI services and third-party APIs while maintaining code maintainability and testing efficiency. 11 5.1.4 Database Implementation (MongoDB & Firebase) While developing views of the application, the dual database, MongoDB and Firebase, came quite in handy. The flexible document model in MongoDB promotes efficient querying for personalized recommendations in dealing with this weirdly shaped relationship of books, users, and their reading progress. Optimizing for read-heavy operations, our schema design enables fast read operations important to access books and manage user profiles. Firebase offers a great real-time database both for the chat system and reading progress synchronization, maintaining sub-second latency for real-time updates across devices. Our database schema: 12 Our firebase for chatting system: 13 5.1.5 API Testing & Documentation (Postman) We used REST APIs. Postman is our main tool for API testing & documentation. We used 2 environments, local and production. We used Global variables. Perfectly organized folders and routes. 14 15 5.1.6 Web Application Features: Readio makes use of JSON Web Tokens for strong authentication flow. When a user authenticates, the application will generate a secure token. A user has to possess this token in order to get their content to read and make use of AI-related capabilities. Passwords are hashed using bcrypt before storing in MongoDB; email verification adds an additional layer of security. Role-based authorization logic has been implemented at each endpoint to verify the type of user from the JWT payload-be that a free user, a premium subscriber, or an admin. It also performs CORS configuration, secure HTTP headers, and rate-limiting through express-rate-limit against abuse and common web vulnerabilities, thus allowing for the delivery of a secure read environment. 6 User-Friendly Interface 6.1 Splash Screen Figure 1: splash screen is an introductory screen that appears when an application is launched. 16 6.2 Onboarding Page Figure 2: onboarding page (or series of pages) is designed to introduce new users to an app or service. The goal is to guide users through initial setup and demonstrate core features and benefits. 17 6.3 Login and sign up and verification pages TheLogin is way for users to access their accounts securely using their email and password on this page. It offers real-time input field validation, shows error messages in case of invalid credentials,The Email address should be valid, for example, user@example.com and cannot be empty or with a wrong format. It checks the email with a regular expression matching some text before and after the @ symbol and a valid domain at the end like.com. Password: field has to be at least 6 characters and cannot be blank. Any errors, be it a required or invalid input, are displayed as messages near the fields and should be satisfied for the form to proceed to login. Signup is allows new users to create an account, providing an email and password. It validates input fields, ensuring that passwords meet the security requirements and match in confirmation. After successful registration, a user is sent to an email verification step,and it work like login. Email Verification is ensures authenticity for the account because it would make the user enter the code that will come to the registered email,the code that should enter is 6 characters . Figure 3: Login, register, and send verification to email 18 Figure 4: Login, register, and send verification code to email 19 6.4 App pages 6.4.1 HomePage The homepage provides an interface for viewing books and authors for users. The users can navigate through the different categories like political and social commentary, personal reading history, popular or trending books. Flags top-rated authors their contributions at the top. Has a search option to quickly get to any book or author. Each section is designed to be scrolled easily. Figure 5: Home page 6.4.2 Latest Page The Latest page provides for users explore the most recent books available in the collection. Users can toggle between grid and list views to customize how they browse the content. A dynamic search feature allows for quick and precise filtering of books by title or author, ensuring a personalized discovery experience. Each book is displayed with essential details such as title and author and rating, and pricing. 20 Figure 6: Latest page 6.4.3 book details page The DetailPage will provide a detailed view for the selected book, including title of the book, authors, whether free or the price, description, cover image, rating, number of views and if it is a premium title-one that requires either purchase or subscription. Users are provided with the ability to favorite the book, download for offline access, open in a PDF viewer, and request a summary generated by an AI. It can also be listened to as an audio book; users report issues, view, and write reviews.The reviews and ratings are part of the interactive features that let users further rate books, give reading feedback, or even send in their reviews. In cases of premium content, users will be taken through to a purchase or subscription activation if need be. Figure 7: book detail page 21 6.4.4 Report page The Report Page enable the user to report the issue with the particular book, providing a detailed description. This includes a text input field for describing the problem that users have to describe with more than 10 characters to proceed. Figure 8: report page 6.4.5 the review and rating The Write Review feature lets users leave feedback about a certain book, complete with a star rating and written review. It forces them to give a rating and fill in the box for a description, continuing on their way. With the use of Claude AI by Anthropic, the app takes a closer look at the review provided. This AI flags things that are inappropriate because of insults and/or cursing but still allows constructive criticism. If the review has some unacceptable content, users are presented with feedback about why their review was rejected and how to revise it. Any duplicate reviews or invalid submissions result in elegant error messages,The See Reviews page lists all reviews for a book, complete with the reviewer's name, profile picture, rating, and review text. The reviews show with a timestamp and can be edited or deleted by a logged-in user directly from this page. It updates or deletes on the server. The app provides for an impartial and transparent review system through the ability to critique content with users while preventing offensive or inappropriate language, all with AI moderation . 22 Figure 9: See reviews & Write reviews&rating 6.4.6 summary & listen The Summaries feature uses advanced AI to generate long, detailed summaries of the contents within the book. Using Claude AI from Anthropic, this application creates-with precision-a short yet summary profile of the book. The accessibility of the application is enhanced with an audio version of the summaries of the books by the Listen feature. This application will convert text summaries into high-quality, natural-sounding speech using the ElevenLabs API. Users can now listen to these audio summaries with play, pause, rewind, and forward options. Figure 10 : Summary & Listen 6.4.7 subscription & purchase books Purchase and Subscription system guarantees that a user can get access to the book only in the case of valid 23 ownership or active subscription. This system checks the given application's user access rights for a certain book with purchase and active subscription or, if it is free. In that case, if the book is purchased or free, the access opens directly. In the case of subscription-based content, the app checks whether the user's subscription is active before allowing access to read or download. Figure 11 : Subscription Figure 12 : Purchase book 24 6.4.8 Reading the books The PDF and Reading Features allow users to seamlessly view and read books within the app. It checks the user's access via purchase or subscription and opens the book in an integrated PDF Viewer. It also counts views and updates the reading history for personalized user engagement. If the access is restricted, it will ask the user to purchase or subscribe. Figure 13: Reading book from pdf 6.4.9 download books feature The Download Feature allows users to download securely the books for offline access. In case of a download request, the application will check the user's access through authentication and purchase or subscription status. After the successful execution of it, the app stores the local details of the book, including the title, image, and PDF link, using Hive Database for offline accessibility even without an active internet connection. Users are notified once the download is successful. Records duplication is avoided by checking the already existing downloads in Hive storage. Figure 14: Download 25 6.4.10 authors page It allows users to find the authors and their works, it provides integrations of displayed functionalities: listed authors, showing detailed search functions to find certain authors and giving detailed profiles on the authors themselves. Users can view detailed information about any author, including biographies and social media links, with an averaged rating based on his published works,and the books for each author Figure 15: Authors & Author informations 6.4.11 Profile Page The Profile page shows user subscriptions and purchased books. It also includes information such as the name, email, gender, phone number, and profile picture of the user. The user can see the purchased books in a horizontal carousel for easy access to the detailed pages of each book. The following image shows an active subscription emphasizing the name of the plan, price, duration, and whether the subscription is active or expired. Subscriptions and purchased books are laid out through intuitive tabbed organization.This page also covers the most important user actions, such as editing profile details, managing favorites, accessing downloaded content, and safely logging out. Users can edit their personal information, which includes updating a profile picture or password, or delete the account upon a confirmation step to prevent accidental user actions. 26 Figure 16: Profile Page Figure 17: Download and favorites contant 27 Figure 18: Edit profile 6.4.12 Dark mode feature Figure 19: Dark mode 28 6.4.13 chatting feature The Chat System will provide real-time messaging with an admin, which will allow users to send and receive text messages along with file attachments within a conversational interface. This screen will load the chat messages from the backend server and show them in a list. Messages are to be aligned differently depending on whether it is sent by the user or received. Figure 20: Chatting system 6.4.14 Notification feature It relies on Firebase Cloud Messaging, which generates a unique token for the user's device using FCM. Once notifications are enabled, this will be retrieved in the app to subsequently register it into a backend using an API where it is kept tied with the user account. The above-mentioned FCM token works at the server side to forward any message via device-unique targeted notification. It also enables the notifications to be disabled-if so, the token is unregistered by notification to the server, which will discontinue further notifications. This system guarantees that notifications can be delivered securely to authenticated users' devices only. Figure 21: notification 29 6.5 Admin Dashboard Side 6.5.1 Login Page Figure 22: Web login page 30 6.5.2 Admin Dashboard Figure 23: Admin Dashboard Category Page On this page, the admin can add, edit, and delete a category, and can toggle the category to hide it from the user instead of deleting it from the database,and can search for any category. 31 Figure 24: Category Page Figure 25: Add Category Page 32 Figure 26: Update Category Page Figure 27: Delete category 33 6.5.3 Authors page On this page, the admin can add, edit, and delete a author, and can toggle the author card to hide it from the user instead of deleting it from the database,and can search for any author. Figure 28: Authors page Figure 29: add author 34 Figure 30:Edit author Figure 31: Delete author 6.5.4 Books page On this page, the admin can add, edit, and delete a books, and can toggle the book card to hide it from the user instead of deleting it from the database,and can search for any book. 35 Figure 32: Books page Figure 33: Add book 36 Figure 33: Edit book Figure 35: Delete book 37 6.5.5 users page the admin can edit, and delete user from database, and search on any user. Figure 36:Display users Figure 37:Update user info 38 6.5.6 Subscription plans the admin can add plans and edit it and delete it. Figure 38:Display subscription plans Figure 39:Add subscription plans 39 Figure 40: Edit subscription plans 6.5.7 Transactions this page display the transaction that users makes,and the admin can search in any transaction according date and user and type. Figure 41: Tasks & Messages 40 6.5.8 Reviews page this page display all reviews in all books and the admin can search in book to see book reviews. Figure 42 : Display all reviews in all books 6.5.9 Report page Figure 43: Display all report 41 6.5.10 Notifications page Figure 44: Admin send Notifications to users 42 6.5.11 Chatting system Figure 45:Chatting between user and admin 7 Result & Discussion Readio positions itself as a high-end digital reading platform and has successfully married AI with traditional e-book functionality. It is performing very well: multitasking with the number of users, speed of book delivery, and integration of AI features with no lag. Metrics adoption by users is good, especially the ability to read offline and AI-driven summarization of books. This application brings conventional e-reader applications with modern AI-driven enhancements closer together through its intuitively designed interface. 8 Conclusion Readio is an innovatively accessible, complete digital reading platform that breaks the mold between classic e-reading and AI-enhanced modern experiences. Importantly, the app serves from casual users to academic users by thoughtfully integrating AI features in addition to the core reading functionality. Casual users will enjoy intuitive reading interfaces and offline access, while power users will appreciate advanced AI-powered features, including summarization and text-to-speech capabilities. It addresses performance, security, and scalability within the backend, married with a responsive Flutter-based frontend, to show what the platform is capable of when it comes to handling demanding reading and AI processing tasks. Because of its seamless integration, 43 strong offline capability, and consistent performance across devices, Readio raises the bar high about artificial intelligence in digital reading applications. In the end, Readio does more than just meet; it succeeds in outperforming any modern, purely digital reading solution and creates a strong base for additional enhancements of AI-powered reading in the future. Having excellent technical architecture and user-oriented design, it is strongly positioned as a leader in the digital reading ecosystem, especially in markets with demand for intellectual reading. References [1] NodeJS Course. (n.d.). Retrieved from https://www.udemy.com/course/the-complete-nodejs-developer-course-2/ [2] Stackoverflow. (n.d.). Retrieved from https://stackoverflow.com/. [3] Node.js. (n.d.). Retrieved from https://nodejs.org/ [4] MongoDB. (n.d.). Retrieved from https://www.mongodb.com/ [5] JSON Web Token. (n.d.). Retrieved from https://jwt.io/ [6] bcrypt. (n.d.). Retrieved from https://www.npmjs.com/package/bcrypt [7] Cloudinary. (n.d.). Retrieved from https://cloudinary.com/ [8] CORS (Cross-Origin Resource Sharing). (n.d.). Retrieved from https://developer.mozilla.org/en- US/docs/Web/HTTP/CORS [9] dotenv. (n.d.). Retrieved from https://www.npmjs.com/package/dotenv [10] multer. (n.d.). Retrieved from https://www.npmjs.com/package/multer [11] Nodemailer. (n.d.). Retrieved from https://nodemailer.com/ [12] Nodemon. (n.d.). Retrieved from https://nodemon.io/ [13] Express Rate Limit. (n.d.). Retrieved from https://www.npmjs.com/package/express-rate-limit [14] Lahza API. (n.d.). Retrieved from https://lahza.com/ [15] Render. (n.d.). Retrieved from https://render.com/ [16] Anthropic Claude AI. (n.d.). Retrieved from https://www.anthropic.com/ [17] ElevenLabs Text-to-Speech API. (n.d.). Retrieved from https://elevenlabs.io/docs [18] Firebase Documentation. (n.d.). Retrieved from https://firebase.google.com/docs [19] Mongoose ODM Documentation. (n.d.). Retrieved from https://mongoosejs.com/docs/ [20] Express Security Best Practices. (n.d.). Retrieved from https://expressjs.com/en/advanced/best-practice-security.html [21] Helmet.js Security. (n.d.). Retrieved from https://helmetjs.github.io/ [22] SendGrid Documentation. (n.d.). Retrieved from https://docs.sendgrid.com/ 44 http://www.mongodb.com/ http://www.npmjs.com/package/bcrypt http://www.npmjs.com/package/dotenv http://www.npmjs.com/package/multer http://www.npmjs.com/package/express-rate-limit https://render.com/ https://elevenlabs.io/docs https://mongoosejs.com/docs/ https://expressjs.com/en/advanced/best-practice-security.html https://helmetjs.github.io/ https://docs.sendgrid.com/ [23] Firebase Cloud Messaging. (n.d.). Retrieved from https://firebase.google.com/docs/cloud-messaging [24] ESLint Documentation. (n.d.). Retrieved from https://eslint.org/docs/latest/ [25] Prettier Code Formatter. (n.d.). Retrieved from https://prettier.io/docs/en/ [26] Express.js Documentation. (n.d.). Retrieved from https://expressjs.com/ [27] Joi Validation. (n.d.). Retrieved from https://joi.dev/api/ [28] PDF2JSON Documentation. (n.d.). Retrieved from https://www.npmjs.com/package/pdf2json [29] PDF.js by Mozilla. (n.d.). Retrieved from https://mozilla.github.io/pdf.js/ [30] Axios HTTP Client. (n.d.). Retrieved from https://axios-http.com/docs/intro [31] Multer Storage Cloudinary. (n.d.). Retrieved from https://www.npmjs.com/package/multer-storage-cloudinary [32] ESLint Airbnb Style Guide. (n.d.). Retrieved from https://github.com/airbnb/javascript [33] Firebase Admin SDK Documentation. (n.d.). Retrieved from https://firebase.google.com/docs/admin/setup [34] SendGrid Mail Service. (n.d.). Retrieved from https://docs.sendgrid.com/for-developers/sending-email/api-getting-started [35] HTTP Status Codes. (n.d.). Retrieved from https://www.npmjs.com/package/http-status-codes [36] flutter localizations. (n.d.). Retrieved from https://pub.dev/packages/flutterlocalizations [37] cupertino icons. (n.d.). Retrieved from https://pub.dev/packages/cupertinoicons [38] http. (n.d.). Retrieved from https://pub.dev/packages/http [39] animated background. (n.d.). Retrieved from https://pub.dev/packages/animatedbackground [40] image picker. (n.d.). Retrieved from https://pub.dev/packages/imagepicker [41] dio. (n.d.). Retrieved from https://pub.dev/packages/dio [42] flutter staggered grid view. (n.d.). Retrieved from https://pub.dev/packages/flutterstaggeredgridview [43] dotted border. (n.d.). Retrieved from https://pub.dev/packages/dottedborder [44] social media flutter. (n.d.). Retrieved from https://pub.dev/packages/socialmediaf lutter [45] font awesome flutter. (n.d.). Retrieved from https://pub.dev/packages/fontawesomef lutter [46] google fonts. (n.d.). Retrieved from https://pub.dev/packages/googlef onts [47] url launcher. (n.d.). Retrieved from https://pub.dev/packages/urllauncher [48] carousel slider. (n.d.). Retrieved from https://pub.dev/packages/carouselslider [49] cached network image. (n.d.). Retrieved from https://pub.dev/packages/cachednetworkimage [50] simple circular progress bar. (n.d.). Retrieved from https://pub.dev/packages/simplecircularprogressbar [51] favorite button. (n.d.). Retrieved from https://pub.dev/packages/favoritebutton [52] file picker. (n.d.). Retrieved from https://pub.dev/packages/filepicker [53] like button. (n.d.). Retrieved from https://pub.dev/packages/likebutton [54] image preview. (n.d.). Retrieved from https://pub.dev/packages/imagepreview [55] flutter expandable text. (n.d.). Retrieved from https://pub.dev/packages/flutterexpandabletext 45 https://firebase.google.com/docs/cloud-messaging https://prettier.io/docs/en/ https://expressjs.com/ https://joi.dev/api/ [56] get. (n.d.). Retrieved from https://pub.dev/packages/get [57] fl chart. (n.d.). Retrieved from https://pub.dev/packages/flchart [58] onesignal flutter. (n.d.). Retrieved from https://pub.dev/packages/onesignalf lutter [59] firebase core. (n.d.). Retrieved from https://pub.dev/packages/firebasecore [60] permission handler. (n.d.). Retrieved from https://pub.dev/packages/permissionhandler [61] cloud firestore. (n.d.). Retrieved from https://pub.dev/packages/cloudf irestore [62] quickalert. (n.d.). Retrieved from https://pub.dev/packages/quickalert [63] smooth page indicator. (n.d.). Retrieved from https://pub.dev/packages/smoothpageindicator [64] share plus. (n.d.). Retrieved from https://pub.dev/packages/shareplus [65] flutter colorpicker. (n.d.). Retrieved from https://pub.dev/packages/fluttercolorp [66] Flutter Course 1. (n.d.). Retrieved from https://www.udemy.com/course/complete-flutter- arabic/?couponCode=LETSLEARNNOW [67] Flutter Course 1. (n.d.). Retrieved from https://www.udemy.com/course/complete-flutter- arabic/?couponCode=LETSLEARNNOW [68] Flutter Course 2. (n.d.). Retrieved from https://www.youtube.com/@Code2Start [69] Flutter. (n.d.). Retrieved from https://flutter.dev/ 46 https://pub.dev/packages/quickalert https://pub.dev/packages/smoothpageindicator https://pub.dev/packages/shareplus https://pub.dev/packages/fluttercolorp http://www.udemy.com/course/complete-flutter- http://www.udemy.com/course/complete-flutter- https://www.youtube.com/%40Code2Start 47 Acknowledgment Abstract Introduction 1.1. Problem 1.2. Objectives 1.3. Significance of this work 1.4. Organization of the report 2​Constraints & Earlier Work 2.1​Constraints 2.1.1​Technological Constraints 2.1.2​Operational Constraints 2.1.3​User Experience Constraints​ 2.2​Constraints 2.2.1​Earlier Work 3​Literature Review 3.1​Digital Reading Platforms and User Experience 3.2​AI Integration in Digital Reading 3.3​Offline Reading and Data Synchronization 3.4​User Engagement and Social Reading 3.5​Accessibility and Inclusion 4​Methodology 4.1​Technology Stack Selection 4.1.1​Core Backend Architecture 4.1.2​Database and Data Management 4.1.3​Security Framework 4.1.4​Cloud Services and Storage 4.1.5​Communication and Notification Systems 4.1.6​AI Integration and Enhanced Features 4.1.7​Payment and Subscription Management 4.1.8​Development and Quality Assurance 4.1.9​Real-time Features and Content Management 5​Results & Discussion 5.1​Technologies Used 5.1.1​Mobile Frontend ( Flutter ) 5.1.2​Web Frontend ( Flutter Web ) 5.1.3​Backend Architecture (Node.js & Express) 5.1.4​Database Implementation (MongoDB & Firebase) 5.1.5​API Testing & Documentation (Postman) 5.1.6​Web Application Features: 6​User-Friendly Interface 6.1​Splash Screen 6.2​Onboarding Page 6.3​Login and sign up and verification pages ​TheLogin is way for users to access their accounts securely using their email and password on this page. It offers real-time input field validation, shows error messages in case of invalid credentials,The Email address should be valid, for example, user@example.com and cannot be empty or with a wrong format. It checks the email with a regular expression matching some text before and after the @ symbol and a valid domain at the end like.com. Password: field has to be at least 6 characters and cannot be blank. Any errors, be it a required or invalid input, are displayed as messages near the fields and should be satisfied for the form to proceed to login. Signup is allows new users to create an account, providing an email and password. It validates input fields, ensuring that passwords meet the security requirements and match in confirmation. After successful registration, a user is sent to an email verification step,and it work like login. Email Verification is ensures authenticity for the account because it would make the user enter the code that will come to the registered email,the code that should enter is 6 characters . 6.4​App pages 6.4.1​HomePage 6.4.2​Latest Page 6.4.3​book details page 6.4.4​Report page 6.4.5​the review and rating 6.4.6​summary & listen 6.4.7​subscription & purchase books 6.4.8​Reading the books 6.4.9​download books feature The Download Feature allows users to download securely the books for offline access. In case of a download request, the application will check the user's access through authentication and purchase or subscription status. After the successful execution of it, the app stores the local details of the book, including the title, image, and PDF link, using Hive Database for offline accessibility even without an active internet connection. Users are notified once the download is successful. Records duplication is avoided by checking the already existing downloads in Hive storage. 6.4.10​authors page 6.4.11​Profile Page 6.4.12​ Dark mode feature 6.4.13​chatting feature 6.4.14​Notification feature 6.5​Admin Dashboard Side 6.5.1​Login Page 6.5.2​Admin Dashboard Category Page 6.5.3​Authors page 6.5.4​Books page 6.5.5​users page 6.5.6​Subscription plans 6.5.7​Transactions 6.5.8​Reviews page 6.5.9​Report page 6.5.10​Notifications page 6.5.11​Chatting system 7​Result & Discussion 8​Conclusion References