Building an e-commerce system with integrated AIStylish chatbot to support fashion consulting

SYSTEM ANALYSIS AND
DESIGN
Chatbot application sales website supports fashion consulting
Version : 1.0
Author : Group 2
Date : 12/02/2025
Project : AI Stylish - fashion style consultant

Table of Contents
I. Modeling requirements using UML. ........................................................................................... 1
1. Use case diagram. ................................................................................................................... 1
2. Decompose the “Administrator” use case............................................................................... 5
3. Decompose the “User” use case ............................................................................................ 9
4. Active diagram...................................................................................................................... 13
5. Pakage diagram..................................................................................................................... 16
II. Program interface..................................................................................................................... 18
1. Sign In................................................................................................................................... 18
2. Home Page............................................................................................................................ 19
2.1. Site Structure.................................................................................................................. 19
2.2. Navigation Bar (Top)..................................................................................................... 19
2.3. Main Content Section .................................................................................................... 20
2.4. Bottom Section - Chatbot & Customer Support ............................................................ 21
2.5. Interface Purpose ........................................................................................................... 21
3. ChatBox ................................................................................................................................ 22
III. Program data design................................................................................................................ 24
IV. Overall program design .......................................................................................................... 27
1. System architecture............................................................................................................... 27
2. System architecture diagram................................................................................................. 28
2.1 Main system workflow ................................................................................................... 28
2.2 System components ........................................................................................................ 29
3. Data Flow in the System....................................................................................................... 30
4. Deployment Technology....................................................................................................... 30
5. System Security Solutions .................................................................................................... 31
6. System expansion and upgrade............................................................................................. 31
V. Conclusion ............................................................................................................................... 32

1
I. Modeling requirements using UML.
Based on the URD (User Requirement Document) and SRS (Software Requirement Specification)
documents, we model the AIStylish system using the following types of UML diagrams:
1. Use case diagram.
Figure 1: Use case diagram
Below is our analysis of the Use Case diagram:
a. Actors
• Admin: Is the system administrator, has access rights and performs management
functions.
• User: Is the user of AIStylish chatbot, interacts with the system to receive fashion
suggestions and save related information.
b. Admin Use Cases

2
• Login: Admin logs into the system to access management functions.
• Product management: Admin manages fashion product information (add, edit, delete
product information).
• Chat management: Admin tracks or manages chat history between users and chatbot.
• Account management: Admin manages user accounts (create, edit, or delete accounts).
c. User Use Cases
• Login: User logs into personal account.
• Register: User registers a new account on the system.
• Add chat: User sends personal information, requests or starts a new conversation with
chatbot.
• Chat with AIStylish: User interacts with chatbot to get fashion suggestions based on
preferences and personal information.
• Edit chat: User edits or updates information in the chat (if supported by the system).
d. Relationship between agent and Use Case
• Admin: Only allowed to use functions related to administration.
• User: Can perform registration, login, interact with chatbot and edit data in the chat.
Use case diagram specification
ID Use Case
Name
Description Actors Preconditions Main Flow Alternative
Flow
Postconditions
1 Login Users or
admins log
into the
system.
User,
Admin
The account
must be
registered.
1. User enters
email/password.
2. System
verifies
credentials
3. If valid, user
is granted
access.
If the password
is incorrect, an
error message
is displayed,
prompting re-
entry.
User is logged
into the system.

3
2 Register Users create
a new
account
User User does not
have an
account yet.
1. Enter
required
information
(email,
password).
2. System
validates the
input.
3. If valid,
account is
created
successfully.
If email
already exists,
display an
error message.
User has a new
account and can
log in.
3 Product
Manage
ment
Admins
add, edit, or
delete
products.
Admin Admin is
logged in.
1. Admin
accesses the
product
management
page.
2. Selects add,
edit, or delete
option.
3. System
updates the
database.
If a system
error occurs,
display an
error message
and prompt
retry.
Product list is
updated.
4 Account
Manage
ment
Admins
view and
manage user
accounts.
Admin Admin is
logged in.
1. Admin
navigates to the
account
management
page.
2. System
displays a list of
users.
3. Admin can
edit or suspend
accounts.
If a system
error occurs,
display an
error message
User account list
is updated.
5 Chat
Manage
ment
Admins
monitor and
manage
AIStylish
chatbot
interactions.
Admin Admin is
logged in.
1. Admin
accesses the
chatbot
management
page.
2. Updates
chatbot data or
reviews chat
history.
If a system
error occurs,
display an
error message
and prompt
retry.
Chatbot data is
updated.

4
6 Add Chat Users start a
new chat
session.
User User is logged
in.
1. User selects
"Start Chat".
2. System opens
a new chat
session.
If a system
error occurs,
display an
error message.
A new chat
session is
created.
7 Chat with
AIStylish
Users
receive
fashion
advice from
the AI
chatbot.
User User has an
active chat
session.
1. User inputs
preferences
(style, colors,
clothing type).
2. AIStylish
processes the
input and
provides
recommendatio
ns.
3. User can
browse
suggestions and
respond.
If no suitable
data is found,
chatbot
requests
additional
input.
User receives
fashion advice.
8 Edit Chat Users edit
their chat
messages.
User A previous
chat session
exists.
1. User selects a
message to edit.
2. System
updates the
message
content.
If a system
error occurs,
display an
error message.
Message content
is updated
successfully.

5
2. Decompose the“Administrator” use case
Figure 2: Decompose the "Administrator" use case
The above use case diagram describes the main functions of Admin in the management system
with specific functional decompositions. Below is a detailed explanation:
a. Actor (Admin): Admin is the main user of the system, responsible for performing
administrative functions.
b.Main use cases:
• Login: Admin must log in to the system before performing management operations.
• Products Management:
− This function includes product management, which is decomposed into two specific
functions:
• Product Lock: Lock products in the system.
• Product Account: Manage product accounts or related to product information.

6
• Account Management:
− Manage accounts in the system, including:
• Account Lock: Lock user accounts.
• Unlock Account: Unlock user accounts.
c. Relationships between use cases:
• The “extend” relationship:
− Indicates that some functions are extensions (optional) of the main function.
− Product Lock and Product Account extend the Products Management function.
− Account Lock and Unlock Account extend the Account Management function.
d. Significance of the diagram:
• This diagram helps clarify the roles and responsibilities of the Admin in the system.
• Decomposing the functions helps the system to be designed clearly, easy to maintain and
expand.
Admin use case specification
ID Use
Case
Name
Flow
Postconditions
1 Login Admin logs
into the
system.
Admin The account
must be
registered.
1. User enters
email/password.
2. System
verifies
credentials
3. If valid, user
is granted
access.
If the password
is incorrect, an
error message is
displayed,
prompting re-
entry.
Admin is logged
into the system.

7
2 Produc
t
Manag
ement
Admin
manages
product-
related
operations.
Admin Admin is
logged in.
1. Admin
accesses the
product
management
page.
2. Selects an
action (add,
edit, delete,
lock).
3. System
updates the
product
database.
If a system error
occurs, display
an error message
Product list is
updated.
3 Produc
t Lock
(Exten
d)
Admin locks a
specific
product.
Admin Admin is in the
product
management
section.
1. Admin
selects a
product.
2. Chooses the
lock option.
3. System
updates the
product status.
If an error
occurs, display
an error
message.
Product is locked
and unavailable
for users.
4 Produc
t
Accou
nt
(Exten
d)
Admin
manages
product-
related
accounts.
product
management
section.
1. Admin
selects a
product-related
account.
2. Updates
account details
or removes it.
3. System
applies changes.
If an error
occurs, display
an error
message.
Product account
details are
updated.

8
5 Accou
nt
Manag
ement
Admin
manages user
accounts.
Admin Admin is
logged in.
1. Admin
accesses the
account
management
section.
2. Selects an
account to
manage.
3. Edits, locks,
or unlocks
accounts.
If an error
occurs, display
an error
message.
User account
details are
updated.
6 Accou
nt
Lock
(Exten
d)
Admin locks a
specific user
account.
account
management
section.
1. Admin
selects a user
account.
2. Chooses the
lock option.
3. System
updates the
account status.
If an error
occurs, display
an error
message.
User account is
locked and
cannot log in
7 Unloc
k
Accou
nt
(Exten
d)
Admin
unlocks a
previously
locked
account.
User Admin is in the
account
management
section.
1. Admin
selects a locked
user account.
2. Chooses the
unlock option.
3. System
updates the
account status.
If an error
occurs, display
an error
message.
User account is
unlocked and
can log in again.

9
3. Decompose the“User”use case
Figure 3: Decompose the “User” use case
The above use case diagram describes the main functions of Admin in the management system
with specific functional decompositions. Below is a detailed explanation:

10
a. Actor (USER): USER represents the system user, performing interactive operations with the
application or system.
b. Main use cases:
• Login: Users need to log in to the system to use the features.
• Register: Users can register a new account to create information and access the system.
• Add chat: Users can create new chats.
• Delete chat (extend): This is an extended function, allowing users to delete added chats.
• Chat with AIStylish: Users interact with an AI named "AIStylish" to chat or receive
support.
• Save and share styles (extend): Extends the chat function, allowing to save and share
styles created or suggested by AIStylish.
• Edit chat: Users can edit previously created chats.
c. Relationship between use cases:
“Extend” relationship:
• Some functions extend from the main function:
− Delete chat is an additional function of Add chat, allowing to delete chat content.
− Save and share styles is an additional function of Chat with AIStylish, providing
additional options to store and share information generated by AI.
d. Meaning of the diagram:
• The diagram helps to clearly describe the interactions between the user and the system.
• Decomposing functions makes the system easier to design, develop and maintain.
• Extend functions show additional actions, which are not required but increase flexibility
and user experience.

11
User use case specification
ID Use
Case
Name
Flow
Postconditions
1 Login User logs
into the
system.
User The user
account must
be registered
1. User enters
credentials.
2. System verifies
credentials.
3. If valid, user is
granted access.
If credentials are
incorrect, an
error message is
displayed,
prompting re-
entry.
User is logged
into the
system.
2 Register User creates
an account.
User None 1. User provides
registration details.
2. System
validates and
creates an account.
3. Confirmation
message is
displayed.
If input data is
invalid, an error
message is
displayed.
User account is
created.
3 Add
Chat
User adds a
new chat
session.
User User is logged
in.
1. User starts a
new chat.
2. System
initializes a chat
session.
3. Chat is added to
history.
If a system error
occurs, display
an error
message.
Chat session is
added.

12
4 Delete
Chat
(Extend)
User deletes
an existing
chat..
User User has an
active chat
session
1. User selects a
chat.
2. Confirms
deletion.
3. System removes
the chat.
If an error
occurs, display
an error
message.
Chat is
removed from
history.
5 Chat
with
AIStylis
h
User
interacts
with the AI
chatbot for
fashion
consultation
User User is logged
in.
1. User selects a
chat.
2. Confirms
deletion.
3. System removes
the chat.
If AI is
unavailable,
display an error
message.
AIStylish chat
session is
active.
6 Save
and
Share
Styles
(Extend)
User saves
and shares
recommend
ed styles.
User User is
chatting with
AIStylish
1. User selects a
recommended
style.
2. Saves it to
favorites or shares
it.
3. System updates
user preferences.
If an error
occurs, display
an error
message.
Style is saved
or shared.
7 Edit
Chat
User
modifies an
ongoing
chat session.
User User has an
active chat
session.
1. User selects a
message.
2. Edits content.
3. System updates
chat history.
If an error
occurs, display
an error
message.
Chat message
is updated.

14
Figure 4: Active diagram
Here is an overview of the workflow:
a. Is the user logged in?
• Yes: The system takes the user directly to the chatbot.
• No: The system checks if the user wants to register.
b. Does the user choose to register?

15
Yes:
• The user enters registration information.
• The system validates the registration information.
• Valid information:
− Creates a new account.
− The user logs in with the information they just registered.
− Successful login: Goes to the chatbot and continues the process.
− Failed login: Displays an error message and asks to retry.
• Invalid information: Displays an error message and asks to re-enter the registration
information.
No:
• The user logs in with an existing account.
• Successful login: Goes to the chatbot.
• Failed login: Displays an error message and asks to re-try.
c. User provides personal information:
• Information includes: height, weight, interests.
d. Check the validity of information:
Valid information:
• The system uses AI to analyze data.
• Generate personalized style suggestions.
• Display suggestions to the user.
• The system asks if the user wants to provide feedback.
− Feedback available: Store feedback to improve the AI model in the future.
Invalid information:
• Request the user to re-enter the correct data.
e. End of flow:

16
After completing the suggestion display and processing the feedback (if any), the system ends
the process.
5. Pakage diagram
Here is an overview of the Package diagram
a. User Interface
• Functionality: Allows users to log in, register, enter personal information, and view style
suggestions.
• Components:
− Login – Login functionality.
− Register – Register functionality.
− Enter customer information – Enter information such as height, weight, preferences.
− Show style suggestions – Show suitable style suggestions.
• Connectivity:
− Send registration and login requests to the Authentication package.
− Pass user information to AI Analytics for analysis.
− Receive results from Suggested Engine.
− Send feedback to Feedback Management.
b. Authentication

17
• Functionality: Validate login information and process user registration requests.
• Components:
− Registration processing – Process registration requests.
− Login verification – Verify login information.
• Connectivity: Receive requests from the UI, perform checks and authentication before
allowing access to the system.
c. Feedback Management
• Function: Collect feedback from users and store it to improve the system.
• Components:
− Save Feedback – Store user feedback.
− Collect Feedback – Collect feedback to analyze trends.
• Connectivity: Receive feedback from the UI and use it to optimize the system.
d. AI Analytics
• Function:Analyze user data to recommend suitable styles based on preferences, height, weight.
• Components:
− Match customer preferences – Match customer preferences with suitable styles.
− Analyze height and weight – Analyze body shape data to adjust recommendations.
• Connectivity: Receive information from the UI, analyze it and send the results to the Suggested
Engine.
e. Suggested Engine
• Functionality: Generate and update style suggestions based on data from AI analytics.
• Components:
− Update Suggestions – Update suggested styles based on new data.
− Create Style Suggestions – Create personalized style lists.
• Connectivity: Receive analysis results from AI Analytics and send suggestions to the UI.

18
II. Program interface
Below is our team's program interface:
1. Sign In
This is the login interface of our website. This interface allows users to log in to the system. Its
structure will include:
• Login with Google account: Option for users to log in via Google account.
• Login with Facebook account: Option for users to log in via Facebook account

19
2. Home Page
2.1. Site Structure
The site layout is designed to enhance the user experience, making it easy for them to browse,
search, and purchase fashion products with the help of chatbots.
2.2. Navigation Bar (Top)
• Website Logo: Located in the middle, with the brand "FASHION YOUR WAY".
• Menu Button (Left Corner):
− Collapsible menu for product categories and navigation.
− Example categories:
• Home
• Shirts
• Pants
• Shoes

20
• Accessories
• Support
• Search Bar: Located on the right, allows users to search for specific products.
• Cart Icon: Shows cart status and allows users to proceed to checkout.
• User Profile Icon: Allows users to log in, register, or manage their accounts.
2.3. Main Content Section
a. Featured Products Section
The main content is structured into multiple product sections, each highlighting different product
categories.
b. Product Sections
• Shows the latest fashion products for customers to explore.
• Each product card contains:
− Product Image: A square placeholder for the product image.
− Product Information:
− Product Name
− Manufacturer
− Price
c. Bottom Section - Chatbot & Customer Support
• Chatbot Button: Located in the lower right corner, allows users to interact with AIStylish's
fashion assistant to:
• Personalized recommendations based on user preferences (height, weight, skin tone, and
occasion).
• Support product search to find suitable fashion items.
• Support customers with order inquiries, returns, or fashion advice.
d. Interface Purpose
• Seamless shopping experience: Streamlined product categories help users quickly find
relevant items.

21
• Enhanced customer engagement: Built-in chatbot provides real-time support and
recommendations.
• Simplified navigation: Clear and user-friendly layout ensures smooth interactions.
2.4. Bottom Section - Chatbot & Customer Support
• Chatbot Button: Located at the bottom-right corner, allowing users to interact with
AIStylish’s fashion assistant for:
• Personalized recommendations based on user preferences (height, weight, skin tone, and
occasion).
• Product search assistance to find suitable fashion items.
• Customer support for inquiries about orders, returns, or fashion advice.
2.5. Interface Purpose
• Seamless shopping experience: Well-organized product categories help users quickly find
relevant items.
• Enhanced customer engagement: Integrated chatbot provides real-time assistance and
recommendations.
• Simplified navigation: A clear and user-friendly layout ensures smooth interactions.

22
3. ChatBox
This is a chatbot framework for our product introduction or sales website. Here is the structure of
the page:
a. Input Section
• Location: Located at the bottom of the page.
• Components:
− Image icon: Allows users to upload relevant images for the chatbot to process.
− Input bar: Users can enter text to send questions or requests.
− Submit button: Arrow icon, helps send information quickly to the chatbot.
• Function:
− Supports entering text or image data to receive advice.
− Simplifies the process of communicating with the chatbot.

23
b. Chat Display Area
• Location: Center of the page.
• Components:
− Frames that display messages from users and responses from the chatbot.
− Messages from users can appear on the left, and chatbot responses can appear on the
right.
− Some frames may contain text content or suggested illustrations from the chatbot.
• Function:
− Displays the entire conversation history so users can track information seamlessly.
− Provides content in multiple formats (text, images).
c. Logo and additional information area (Header/Sidebar)
• Location: Appears in the upper left and lower corners of the page.
• Components:
− Brand logo: Brand recognition and builds trust with users.
− Additional input fields: Can be used to enter relevant information such as name, email, or
chatbot service selection.
• Function: Supports system navigation or provides necessary contact information.
d. Image Display Area
• Location: Right side of the interface.
• Components: An illustrative image, which can be a suggestion from the chatbot or represent
the status of the conversation.
• Function: Increases visual appeal and makes it easier for users to understand the information
provided.

24
III. Program data design
Here is a detailed explanation of each table in the diagram:
a. Users
• User_ID (PK): Primary key, unique identifier for each user.
• Full name: User's first and last name.
• Email: Email address, usually unique for login.
• Password: User's password.
• Date of birth: User's date of birth.
• Gender: Gender.
• Preferences: User's fashion preferences.

25
• Created_at: Date the account was created.
• Updated_at: Date the information was updated.
b. Products
• Product_ID (PK): Primary key, unique identifier for the product.
• Name: Product name.
• Description: Product description.
• Price: Product price.
• Category: Product type (e.g. shirt, pants, shoes, accessories).
• Size: Product size.
• Colors: Product color.
• Image_urls: Link to product image.
• Created_at: Date the product was added to the system.
• Updated_at: Date the product information was updated.
c. Transactions
• Transactions_ID (PK): Primary key, unique identifier for each transaction.
• User_ID (FK): Foreign key associated with the Users table.
• Product_ID (FK): Foreign key associated with the Products table.
• Total amount: Total amount of the transaction.
• Payment method: Payment method.
• Created_at: Date the transaction was made.
d. Feedback
• Feedback_ID (PK): Primary key, unique identifier for the feedback.
• Product_ID (FK): Foreign key associated with the Products table.
• Rating: Rating (number of stars).
• Comment: Comment.
• Created_at: Date the feedback was created.
e. Outfits

26
• Outfit_ID (PK): Primary key, unique identifier for the outfit.
• Style: Fashion style.
• Product_ID (FK): Foreign key to the Products table.
• Generated_at: Date the outfit was created.
f. Fashion Trends
• Trend_ID (PK): Primary key, unique identifier for the trend.
• Name: Name of the trend.
• Description: Description of the fashion trend.
• Related Products: Products related to the trend.
• Created_at: Date the trend was created.
g. Admins
• Admin_ID (PK): Primary key, unique identifier for the administrator.
• Name: Name of the administrator.
• Email: Email address of the administrator.
• Password: Password.
• Phone Number: Phone number.
• Roll: Role of the administrator in the system.
h. Relationship between tables:
• A User can perform many Transactions, each transaction is related to a Product.
• A User can leave Feedback for many Products.
• An Outfit can include many Products, belonging to a User.
• Fashion Trends can include many related products.
• Admins have the right to manage the system.

27
IV. Overall program design
1. System architecture
The AIStylish fashion style consulting chatbot system is built according to the Client-Server
model, with a clear separation between the Front-End, Back-End, AI Engine, and Database
components. This makes the system easy to maintain, expand, and optimize performance.
Deployment model:
The system is deployed according to the Microservices model with the following components:
a. Client (Front-End)
• The user interface is built with ReactJs, allowing for smooth and fast interaction.
• The chatbot displays information, receives data from users (text, images) and sends requests
to the server.
• Users can enter personal information such as height, weight, skin tone, and events attended.
b. Back-End (Server)
• Use NodeJs with Express.js to process requests from the Front-End.
• Responsible for calling the API to the AI system to process image and text data.
• Connect to MySQL database to get product information, fashion suggestions.
c. AI Engine (AI Processing)
• Use Python and OpenAI API to process chatbot conversations.
• Use TensorFlow/PyTorch to analyze images, recognize body shape, skin tone.
• Apply Recommendation System algorithm to recommend styles based on user data.
d. Database
• Use MySQL to store user information, products, chat history.
• Combine with Redis to cache data, optimize response speed.
e. Cloud Deployment
• The system can be deployed on AWS, Google Cloud or Azure platforms to ensure
performance and scalability.
• The database is managed on AWS RDS or Google Cloud SQL.

28
2. System architecture diagram
2.1 Main system workflow
a. User browses website and uses chatbot
• User accesses e-commerce website.
• Front-End interface (ReactJs, Yarn) displays product list and AIStylish chatbot.
• User can search for products or ask chatbot for style advice.
b. Chatbot supports product selection
• User provides information (questions, photos, preferences, height, weight).
• Chatbot (AIStylish) receives data and sends request to API Gateway (NodeJs, Express).
• API Gateway analyzes request and can:
− Send data to AI Engine (Python, OpenAI API) for natural language processing.
− Query Product Catalog & Search to get product list.
− Access Recommendation System (ML Model) to suggest suitable outfits.
c. AI processing and product recommendations
• AI Engine (Python, OpenAI API) performs the following tasks:

29
− Image analysis (Image Processing - TensorFlow/PyTorch) if the user uploads a photo.
− Personalized product recommendations (Recommendation System - Machine Learning).
− Chatbot responses with a list of recommended products.
• AIStylish chatbot displays suitable products right in the chat window.
d. Users add products to cart
• After receiving advice, users can add products to the cart (Shopping Cart & Checkout).
• The Shopping Cart system manages orders and connects to the Payment Gateway (Stripe,
PayPal).
e. Payment and order processing
• Users make payment via Payment Gateway.
• After successful payment, the order is confirmed and stored in the Database.
2.2 System components
Component Role
E-commerce Website (Frond-end) Product display, chatbot integration, cart &
checkout processing.
Chatbot AIStylish Receive questions from users, send requests
to AI Engine and return results.
API Gateway Coordinate data between chatbot, AI Engine,
Database, and Payment Gateway.
Auth Service Authenticate users, ensure personal data
security.
AI Engine Conversation handling, requirement analysis,
Recommendation System coordination
Image Processing Detect skin tone, body shape, and clothing in
uploaded photos.
Recommendation System Recommend relevant products based on user
preferences.
Product Catalog & Search Search for products based on keywords or
categories.

30
Database Store user data, products, chat history, orders.
Shopping Cart & Checkout Manage shopping cart and process orders
before checkout.
Cloud Hosting Ensures high performance, easy scaling with
multiple users.
3. Data Flow in the System
Here is a detailed description of how data moves in the system:
a. Chatbot Conversation Processing Flow
• The user enters a question into the chatbot (with a photo).
• The Front-End sends an API request to the Back-End Server.
• The Back-End calls the OpenAI API to process the conversation.
• The OpenAI API returns the answer, which the server displays on the interface.
b. Image Analysis Processing Flow
• The user uploads a photo to the chatbot.
• The photo is sent to the Back-End, then sent to the AI Engine (Python).
• The AI Engine uses Machine Learning to recognize skin tone and body shape.
• The results are saved in the database and returned to the chatbot to display outfit
suggestions.
c. Fashion Product Recommendation Flow
• The chatbot collects data about the user's preferences.
• The Recommendation System analyzes information based on:
• The user's shopping history.
• Popular fashion styles.
• Market trends. The system suggests suitable products and displays them on the chatbot
interface.
4. Deployment Technology
The system uses the following technologies to ensure performance, security and flexible
scalability:

31
Ingredient Technology used
Front-End ReactJs, Yarn
Back-End NodeJs
AI Engine OpenAI API, Python, TensorFlow/PyTorch
Database MySQL
Cloud Hosting AWS/GCP/Azure
Security JWT Authentication, HTTPS, OAuth2
5. System Security Solutions
Because the system processes user data (photos, personal information), security is an important
factor. Security measures include:
a. Data encryption
• HTTPS: All data exchanged between the client and the server is encrypted using the HTTPS
protocol.
• JWT Authentication: Users must log in using JSON Web Token (JWT) to ensure security.
• AES Encryption: Important data such as photos and personal information are encrypted
using the AES-256 algorithm.
b. User authentication
• Use OAuth 2.0 to authenticate logins from Google or Facebook.
• Limit the number of login attempts to avoid Brute Force Attack.
c. API protection
• Apply Rate Limiting to limit the number of API calls, preventing DDoS attacks.
• Use API Gateway to manage and monitor traffic.
d. Protect User Data
• MySQL databases use Role-Based Access Control (RBAC) to limit access.
• Only internal services have access to sensitive data.
6. System expansion and upgrade
The system is designed to be easily scalable when needed:

32
a. Scalability
• Horizontal Scaling: The system can be expanded by adding more back-end servers when
traffic increases.
• CDN (Content Delivery Network): Use Cloudflare CDN to reduce server load.
b. Multi-platform support
• The chatbot system can be integrated on Facebook Messenger, Zalo, Telegram to expand
customer reach.
c. Improve AI and Machine Learning
• Train AI models to better personalize fashion advice.
• Use customer data to improve chatbot accuracy.
V. Conclusion
The System Analysis and Design document describes in detail the architecture, data, and interface
of AIStylish, a fashion consulting chatbot integrated into an e-commerce website. The system is
built according to the Client-Server and Microservices model, using AI, Machine Learning, and
Cloud to provide a personalized shopping experience.
The system helps users easily search, choose the right product, and complete orders right in the
chatbot. With the ability to expand and integrate intelligent AI, AIStylish not only improves user
experience but also optimizes revenue for businesses.
In the future, the system can be upgraded with AR/VR, voice support, and cross-platform
expansion to further improve service quality. The system is ready for deployment and development
in practice.

Building an e-commerce system with integrated AIStylish chatbot to support fashion consulting

More Related Content

Similar to Building an e-commerce system with integrated AIStylish chatbot to support fashion consulting (20)

Recently uploaded (20)

Building an e-commerce system with integrated AIStylish chatbot to support fashion consulting