PROJECT CASE STUDY
Dont Fret is a full e-commerce web application project for a music store. It combines a public shop, product catalogue, shopping basket, customer account area, orders, returns, messages, invoices, and separate admin and staff panels for daily store operations.
PUBLIC PAGES
These screens present the public side of the application where customers can browse products, view promotions, search the catalogue, and access business information.
The homepage works as the main entry point to the store. Customers can see the search bar, category navigation, delivery and payment information, featured products, deals, and best sellers, then move into the catalogue or open a specific product.
The featured products section promotes selected catalogue items. Customers can quickly view highlighted products, check basic product information, and continue to the product details or shopping flow.
The catalogue page shows the full product list. Customers can use category, brand, price, rating, sorting, and page-size filters to find the right instrument or accessory more quickly.
The guitars page narrows the catalogue to guitar products. Users can browse instruments, compare prices, and open selected guitar items without mixing them with other product types.
The amplifiers page displays products for customers looking for amplification equipment. It works as a filtered catalogue view with the same style and shopping logic as the rest of the store.
The accessories page groups supporting items such as strings, cables, tuners, stands, and capos. It helps customers quickly find add-on products for their main instruments.
The best prices page brings together promotional and discounted products. Customers can quickly review deals, reduced items, and value-focused stock.
The About page explains the store, its product focus, mission, key strengths, legal information, and trade customer rules. Users can understand the brand and how business customer support works.
The contact page contains business details and a message form. Customers can send an enquiry to the store and find key contact information such as address, phone, and email.
The login screen allows existing users to access their account. From here, users can move to registration or password recovery if they do not have an account or forgot their login details.
The registration page allows users to create a standard customer account. The form collects account details, while the system separates normal registration from trade accounts created by staff or admins.
The password reset page lets users enter their email address and start account recovery. This allows customers to regain access without contacting administration directly.
The basket shows products added to the order, quantities, VAT, subtotal, delivery, and final total. Customers can review the purchase before checkout and confirm the order is correct.
ACCOUNT PAGES
These screens present the customer account features available after login, including personal profile data, order history, support mailbox, and return requests.
The customer profile allows users to manage personal and business details. Users can update name, email, phone, company, VAT number, and billing or delivery addresses.
The orders page shows the customer purchase history. Users can see order numbers, dates, statuses, totals, and actions for opening a specific order.
The order details page shows the full breakdown of one purchase: status, delivery, addresses, purchased items, payment, and options related to returns or further support.
The return form allows customers to report a product issue. Users provide the return reason, item condition, and contact details, then the request is sent to store staff.
The mailbox shows conversations between the customer and the store. Users can view support threads and open a specific conversation about an order, account, or enquiry.
The conversation view shows the message history inside one thread. Customers can read staff replies and send another message without leaving their account area.
ADMIN PAGES
The admin area gives full access to the system. It includes reporting, product management, order control, invoices, returns, users, support messages, and logs.
The admin dashboard is the main management hub of the application. Admins get quick access to reports, products, orders, invoices, returns, users, messages, and logs.
The reports overview displays key business data: revenue, order count, pending invoices, low stock, best sellers, and core sales indicators.
Detailed reports expand the dashboard data. Admins can analyse stock by supplier, invoice summaries, customer order reports, and stock level breakdowns.
The product list lets admins control the store catalogue. The view shows code, barcode, category, price, stock, active status, and actions for editing or further management.
The create product form is used to add new catalogue items. Admins can set supplier, price, discount, stock, reorder level, description, and product image.
The edit product page allows an existing catalogue item to be updated. Admins can adjust data, barcode, price, stock, description, active status, and visual assets.
The orders page gives admins a full view of transactions. They can check customer, date, status, total, filter results, and move into editing a specific order.
The order status page allows admins to update fulfilment progress. They can review order items, change status, and add or edit the shipment tracking number.
The invoices page shows issued documents with dates, due dates, payment method, total, and status. Admins can edit an invoice or prepare it for printing.
The invoice status page is used to update accounting information. Admins can mark payment progress and keep invoice records accurate.
Returns management shows customer requests with dates, products, reasons, item conditions, and statuses. Admins can monitor all active return cases.
The return review page shows the case details and supports a decision. Admins can approve the return, reject it, or mark it as refunded.
The users panel lets admins control accounts in the system. The view includes roles, statuses, trade accounts, filters, and actions for editing a specific user.
The edit user page allows admins to change account status, role, address details, and trade customer settings. Admins can align user access and customer data with store needs.
Contact messages group customer enquiries sent through the form or mailbox. Admins can search a thread, open the conversation, reply, or delete an unnecessary record.
The support conversation view shows the full message exchange with a customer. Admins can read the case context and send a reply directly from the panel.
Audit logs record important system actions such as changes to orders, stock, invoices, products, messages, SMS activity, and profiles. This helps track the history of operations.
STAFF PAGES
The staff area focuses on day-to-day store operations such as assisting customers, processing orders, dispatch handling, checking stock, managing products, and dealing with returns.
The staff dashboard is the starting point for employees. It provides quick access to daily tasks such as orders, customers, dispatch, stock, invoices, returns, and support.
The manager overview shows key operational numbers, including orders, pending work, low stock, returns, support conversations, and trade customer activity.
Staff alerts highlight items that need attention: pending orders, low stock, overdue invoices, returns, support messages, and stock approvals.
Customer search helps staff quickly find a user account. Staff can use this view while handling an order, invoice, support case, or customer enquiry.
Customer details combine profile data, order history, and invoices in one place. Staff can support the customer more effectively without moving through many separate screens.
The staff orders page allows employees to monitor active transactions, filter them by status, and open individual records for updates or customer support.
This view gives staff a simple way to update order progress and shipping information. Employees can change the status without using the full admin panel.
In-store orders support physical shop sales. Staff can scan barcodes, select a customer, add products, and save the transaction directly in the system.
The create order form allows staff to manually place an order on behalf of a customer. It includes shipping, billing, and fulfilment information.
Creating a trade customer allows staff to register a business account. The form collects company data, contact details, address, VAT, and credit limit required for trade support.
The support conversations view lets staff browse customer cases. Employees can search a thread, open it, reply to the customer, or delete a finished conversation.
The thread view shows the full customer conversation and a reply field. Staff can continue contact in one history so the case stays organised.
The dispatch queue shows orders waiting to be packed or shipped. Staff can check status, tracking number, and open a specific order for updates.
Dispatch order update lets staff change the shipping stage, add or edit tracking, and review the products included in the order.
Staff can access the product list for operational store work. They can check stock, product data, item activity, and move into editing when needed.
Staff product editing includes a barcode preview so employees can verify product identity, stock data, and key information used in the shop.
The low stock page identifies products that have reached or dropped below reorder level. Staff can quickly find items that need replenishment.
The staff invoices page shows issued documents in a structured table. Employees can check payment status and support customers with order-related questions.
The returns page shows customer requests available to staff. Employees can open a case, check the reason, item condition, and current handling status.
Return review lets staff make an operational decision. The return can be approved, rejected, or marked as refunded based on the case outcome.
The reviews section shows customer product feedback. Staff can check product name, user, rating, comment, and date to monitor feedback quality.
The finance queue is designed for payment and invoice-matching work. Staff can view invoices waiting for handling or confirmation.
Pending stock approvals help control stock changes that require approval. Staff or managers can review requests and make a decision.