AAPL Purchase Order Management System | UI UX Designer Consultant in nagpur

Project View

Role - UI/UX Designer

Team Size - 3

This is the Purchase Order Management System Application where the business associates and dealer have the permission to place their order by selecting product items and pay the bill amount directly via online payment gateway, RTGS or cheque details facility. In this app the manufacturer can view how and what products are order by the dealers as well as staff assist to help in delivery of orders.

Business Goals

Reduce the manpower efforts
Accuracy in Payment terms
Remove Creditability
Increase Revenue
Avoid Discussion inbetween Manufacturer and Dealers
View Staff Work Details

Dealers Goals

Dealer Can Place Order Online
View Price and Discount Schemes
Business in Cash / Instant Payment

Introducing AAPL Purchase Order Management System

Clear Information Architecture / User Simple Work Flow

Work Process

Our best practices of work process helps to deliver a project on estimated duration.

Analysis - Discussion with client & Understand requirement
Planning - Information Architecture & Design Wireframe
Design - Mockup Design & Usability Testing
UI Development FrontEnd - Design to HTML Conversion
Design Component base Architecture
Develop FrontEnd in ReactJS
BackEnd - Add Database & Logical Programing
Testing & Release - Manual testing by client & team to Launch
Support

Design Process

UX / UX Design Activity

User Research
Face to face interview (discussion) with users
Competitive Analysis
User Persona
Design Documentation
Wireframe Design (Low fidelity)
Interactive Prototype
User Testing
Interaction Design
Usability Testing (after designed mockup by UI Designer)

Wireframe

Simple UI / UX Design

Admin Login - Super Admin

List of Employee - Super Admin

Employee Profile - Super Admin

Employee Profile Edit - Super Admin

Add Employee Profile - Super Admin

Add Employee Profile Fill - Super Admin

A Screen 6 - Deleted Employees - Super Admin

Deleted Employees List - Super Admin

List of Dealers - Super Admin

Edit Dealers Profile - Super Admin

List of Dealers Previous Order - Super Admin

List of Dealers Previous Order - Invoice - Super Admin

Add Dealers Fill- Super Admin

Add Dealers - Super Admin

Deleted Dealers - Super Admin

Order Reports - Super Admin

Order Reports - Super Admin - Sort By

Order Report - Invoice - Super Admin

D Screen 1 - Login - Existing User Dealer

Login - Existing Dealer

New User Sign up Dealer

New Order Dealer

Dealer Payment Option

Payment Confirmation Dealer

Order Reports Dealer

Order Reports - Sorting Dealer

Cancelled Reason Order Reports Dealer

Invoice - Dealer

Employee Login

Order Report - Employee Section

Sort Order Report - Employee Section

Invoice - Employee Section

Profile - Employee Section

Previous Order Reports - Employee Section

UI Design Elements

Meticulously Designed UI Elements

Grid Layout

Container Fluid

Container

Colors

Element	Color Code	Color
Text Color	#212529
Background Color	#343a40
Success Notification	#28a745
Wrong Notification	#dc3545

Typography

Used Description
Font Family	-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif
Web Icon	Font Awesome
h1. Heading 1	2.5rem
h2. Heading 2	2rem
h3. Heading 3	1.75em
h4. Heading 4	1.5em
h5. Heading 5	1.25em
h6. Heading 6	1em
p	1em
table td, table th	.8rem

Buttons

Button Type 1
Background Color	#338feb
Border Color	#338feb
Border Weight	1px
Font Color	#fff
Font Size	.875rem
Border Radius	.2rem

Button Type 2
Background Color	#fff
Border Color	#17a2b8
Border Weight	1px
Font Color	#17a2b8
Font Size	.875rem
Border Radius	.2rem

Button Type 3
Background Color	#fff
Border Color	#343a40
Border Weight	1px
Font Color	#343a40
Font Size	.875rem
Border Radius	.2rem

Button Type 4
Background Color	#fff
Border Color	#dc3545
Border Weight	1px
Font Color	#dc3545
Font Size	.875rem
Border Radius	.2rem

Tools Used

My Best Knowledge Skills Use to Design Project

Job	Use Tools	Version
Gathering Requirement	Email, Phone, WhatsApp and Meeting	Google Drive
Wireframing	Axure	RP9
Mockups Design	Photoshop, Illustrator	CS5.5
Development	React Js, NodeJs, HTML5, CSS3, Bootstrap4.0.0, Javascript, ES6	Latest
Browser Testing (Desktop)	Google Chrome, Mozilla Firefox, Internet Explore Edge, UC browser	Latest V - Manual
Browser Testing (Mobile)	Samsung Browser and Google Chrome	Latest V - Manual
Server (hosting)	Linux

Additional Services

Setup today's very essential services which helps the website gets much more viewers on all search engine and social media

Setup Meta Tag Title, Description, Keyword of business on website
Generate Sitemap and upload to Google
Setup Google Analytic
Google Webmaster Search Console Setup
Google My Business Account
Create Social Media Accounts : Facebook, Twitter, Instagram, Google, Youtube, Location, Whatsapp
Website Link to Social Media
Email Accounts

Handling Services

Sign the AMC contract to serve the best to the customers

Website and its maintenance

Updation website and backup to save the data

Digital Marketing

Provide the all social media services

Hosting (Server)

Provided the linux base hosting along with email Id's

Purchase Order Management System