45
WEBSITE DEVELOPMENT ON E-COMMERCE Vindhya Institute of Technology & Science, Indore Guided By- Mr Hemant Verma Presented By Kumar Narayan Shubham Mahajan

Ecommerce website with seo optimization

Embed Size (px)

Citation preview

Page 1: Ecommerce website with seo optimization

WEBSITE DEVELOPMENT ON E-

COMMERCE

Vindhya Institute of Technology & Science, Indore

Guided By-Mr Hemant Verma

Presented ByKumar NarayanShubham Mahajan

Page 2: Ecommerce website with seo optimization

ONLINE SHOPING BUSINESS

Project name :- Boutique

World’s Biggest Ecommerce portal

Page 3: Ecommerce website with seo optimization

ABSTRACT Boutique is a modern, clean and professional , It is fully fresh

look, it looks stunning on all types of stylish & Dresses.

Its advance mode to create new generations style.

In this website you get products on free delivery.

User can get product after registration.

100% genuine products

It is super for fashion shop, handmade shop, accessories shop, glasses shop,... or any other categories. 

Page 4: Ecommerce website with seo optimization

GOALS• I want to create more revenue for my eCommerce store• I want to grow my brand• I want to get more people to come to my website.• Those are pretty typical answers that you will hear from eCommerce

manager, web owners, and people with “O’s” in their title (COO, CEO, CTO).  The next question you need to ask is HOW?   The truthful meaning to this project is how you are going to accomplish these goals.  If the answer is farfetched or does not have a valid actionable, then it shouldn’t be a goal.   A few of the answers to “How” for the benefits above would be.

• I want to create more revenue for my eCommerce store.  How?  By creating a user friendly website, with easily navigable pages, thorough search features to help my customers explore our product mix, and starting a digital marketing campaign through email marketing, cpc, and social media.

• Now isn’t that WAY more actionable as a goal?  Yes, I would say so.   By asking “how?”, and making people think, you will formulate a strong game plan and write out the overarching methods to how this project will be successful.

Page 5: Ecommerce website with seo optimization

ScopeThe application consists of following main things:Visitor Features

View Home Banners or Slide Show GalleryBrowse ProductsView Product DetailsView FAQsBecome a Member through Registration processView Static Pages

Registered Member PanelLogin to siteManage AccountMy ProfileMy OrdersBuy Product (Checkout)Logout

Admin PanelLoginDashboardAdministrator User ManagementSite Member(Customer) ManagementBlind Type ManagementProduct Attribute ManagementProduct ManagementPrice Chart ManagementBanner ManagerOrder ManagerShipping Management

Page 6: Ecommerce website with seo optimization

Index▹ 1 EXECUTIVE SUMMARY

1.1 PROJECT BACKGROUND▹ 2 SCOPE OF THE PROJECT

2.1 SCOPE2.1.1 Design Goals2.1.2 High level Requirements2.1.3 Front-End2.3 Back-End2.4 Design Goals

▹ 3 TECHNICAL OVERVIEW3.1 PRODUCTION ENVIRONMENT3.2 DEVELOPMENT ENVIRONMENT3.3 BROWSER COMPATIBILITY

Page 7: Ecommerce website with seo optimization

Introduction▹ 1.1 Background

The purpose of this document is to define the features of the Window Blind E-Commerce Website. Here Visitors can see the publicly available features such as browse products, view details of products (Size, Colour and Cost), and view other static contents of site. Registered User can view all publicly

available features and in addition to this they can purchase the products by adding them into shopping cart. Admin can

manage all the contents and Orders from the Backend (admin side)

Types of Users of the website are:VisitorsCustomers (Registered Member)Admin

Page 8: Ecommerce website with seo optimization

• The objective of this project proposal is to define the project scope of Window Blind ECommerce Website and to provide the Estimation.

• The advantage would be simple user interface that is easy to understand by all type of users.

2.1 SCOPE The scope document is defined after discussing with the Client2.1.1 Design Goals The application consists of following main things:Visitor Features View Home Banners or Slide Show Gallery Browse Products View Product Details View FAQs Become a Member through Registration process View Static Pages

Registered Member Panel Login to site Manage Account My Profile My Orders Buy Product (Checkout) Logout

Admin PanelLoginDashboardAdministrator User ManagementSite Member(Customer) ManagementBlind Type ManagementProduct Attribute ManagementProduct ManagementPrice Chart ManagementBanner ManagerOrder ManagerShipping Management

SCOPE OF THE PROJECT

Page 9: Ecommerce website with seo optimization

2.1.2 High level Requirements

Page 10: Ecommerce website with seo optimization

Product DisplayDisplays productsClick on image will display information of product as well as choice of different sizes if availableView the details of the products, with Image on Product Detail pageView listing of all Related Products

Product NameProduct sizeImage

Clicking on Image, User will navigate to “Product Detail” PageProduct detail PageViews Product details as follow

Product TitleProduct Image Option to view Measuring VideosFeatures of the selected Product

View list of available Fabric with details like Colour Name, and Product Image

Select one FabricDimensions (Size)

User can specifies their Window Pane Size and preferences likePerfect Fit “Blind Type”

PleatedVenetianRoller

Blind “Fabric”Pleated likeSPC / ESP / PlainsCellularBlackout

Venetian like16mm Slat25mm SlatSpecial Slat finishes

Roller likePlain FabricsBlackout Fabrics

Frame ColourFor White or Brown Frames no

charges will be taken If it is Golden Oak Frame then it would incur a 10% surcharge on Total Cost of Blind

HeightWidth

Page 11: Ecommerce website with seo optimization

“Price of Blind” ButtonUser can determine the Price of the Blind based on the given preference(Dimensions)Link to view Price ChartsOption for “Add to Cart”, User can add the Product to Cart with the specified Preference

View Price ChartsVisitor can browse the Price Charts for the Pleated / Venetian / Roller based on the PriceCalculationVisitor can view Drop and Width wise Price of the FabricAs Size (Drop/Width) of Fabric increases Price of Fabric will also raiseWatch Measuring VideosView Measuring Video(s) added by user in conjunction with all Products with details likeTitleDurationDescriptionVisitor can play the selected VideoView CartDisplays products added to the shopping cartWith a small product image, subtotal, shipping amountLink to „Update‟ and „checkout‟Link to „See entire shopping Cart‟Can view its shopping cart (if purchased anything will show list of items that are being purchasedwith the quantity and the total price of those buying)Remove Product from the CartUpdate Quantity and Recalculate Sub Total

Page 12: Ecommerce website with seo optimization

User LoginThis section allows User to enter the website by adding login details created during registrationEnter authenticated Email Address and Password to loginForgot Password LinkRecover password through mailNew User? Sign up link availableRegistration: This section allows New Users to create new registration account on the SiteFill the registration form with all required fieldsEnter Profile details like name, email id, passwordEnter address details like Country, State and Zip CodeSubmit FormAfter creating login, the Customer enters the account with authenticated username and password and can perform the following tasks:My AccountPersonal InformationChange Name, Login, E-mail Address, or PasswordManage Address InformationMy OrdersView all OrdersView order no/ order date/ amount/ quantityView Status (In Process, Shipped, Open, Rejected)History/ReceiptsView Details of all the orders madeView order id, status, date orderedLink to re-Order

Page 13: Ecommerce website with seo optimization

Last OrderDisplays the last order madeLink to reorder and reset quantityView Order TrackingEnter Order NumberView Shopping CartDelete AccountSign outCheckoutProceed to Shipping DetailsView/ Edit Shipping DetailsSelect Shipping MethodProceed to Billing DetailsView/ Edit Billing DetailsReview OrderView Total Order Summary, with Shipping and Billing DetailsProceed to Payment DetailsPayPal Payment Gateway IntegrationOrder ConfirmationShow confirmation of order with order details on the screenFAQDisplays a list of frequently asked QuestionsShipping InformationDetails regarding Shipping information and collaboration with any partners which will beconfirmed with client for more details

Static PagesContact UsAbout UsPrivacy PolicyDisclaimerTerms & Conditions

Page 14: Ecommerce website with seo optimization

2.3 Back-EndAdmin panel is the back end of the application from where the admin can manage the wholesite and its contents as well.LoginAdministrator may login into the admin panel with the authorized username and password to getaccess to this panel.Site MapView Summary of the whole Admin panelAdministrators Users ManagementThe administrator user section shows the list of admin users accessing the panel. The admin cansearch and sort the list. The admin can even edit and delete the existing record.View AdminSearch / Sort Admin usersChange the Status of admin user (Active / Inactive)Add / Edit / Delete Admin UsersCustomer ManagementThe Customer Management section shows the list of customers who have registeredthemselves on the site.View All Customers of the siteSearch / Sort CustomersChange the Status of Customer (Active / Inactive)Add/ Edit / Delete CustomersSend mail to the Customers

Page 15: Ecommerce website with seo optimization

Blind Type ManagementThe Blind Type Management section allows Admin to manage all Blind Types like Pleated / Venetian / Roller available on the Site.View all Blind TypeChange the Status (Active / Inactive)Add / Edit / Delete Blind TypeProduct Attribute Management (Like Sizes and Colors)View All Product AttributeChange the status (Active / Inactive)Sort Product AttributeAdd AttributeEnter Attribute NameEdit / Delete Product Attribute

Product ManagementThe Admin can view all the products that are being displayed on the site.Admin has full rights to add/ edit the particular product once placed on the site.View all productsSearch / Sort ProductsAlphabetical SearchChange the Status (Active / Inactive)Add ProductAdd General Information about the product like Name, Blind Type, AttributeUpload Image and VideoEdit / Delete ProductProduct categories (Category management)

Page 16: Ecommerce website with seo optimization

Tax ManagementView All Tax percentage with the countriesSearch / Sort TaxesChange the Status (Active / Inactive)Add / Edit / Delete TaxesShipping ManagementView all methods of Shipping with the amountSearch / Sort Shipping MethodsChange the Status (Active / Inactive)Add / Edit / Delete Shipping MethodsOrder ManagementView all Order DetailView Order InformationView Billing/ Shipping/ PaymentView/ Change Order Status (In Process, Shipped, Open, Rejected)Search / Sort OrdersAlphabetical SearchEdit / Delete OrdersPrint Order ConfirmationPrint InvoiceFAQ ManagementView all FAQsSearch / Sort FAQsAlphabetical SearchChange the Status (Active / Inactive)Add/ Edit / Delete FAQs

Page 17: Ecommerce website with seo optimization

Email TemplateThere will be different templates available for different occasion like Welcome Mail, ForgotPasswordSystem Settings (General Site Settings)View / Edit all Setting of WebsiteGeneral SettingsName of SiteMain Site TitleURLMeta Tags Information SettingsSite Copyright TextSite Control Panel TitleAdministrator Email IDStatic Pages ManagementView List of Static PagesFCK Editor providedSEO ManagementThe SEO Management section helps the Site Administrator to manage the traffic & activity performed on Site by Users/ BuyersView all Meta tags & KeywordsSearch/ Sort Meta tags & keywordsChange the Status (Active/ Inactive)Edit/ Delete Meta TagsView all login IPsSearch/ Sort IPChange the Status (Active/ Inactive)Block IP

Log outThe Administrator can log out of the admin panel from the log out link given in the panel.

Page 18: Ecommerce website with seo optimization

2.4 Design GoalsThe application consists of following main sections:Visitor FeaturesView Home Banners or Slide Show GalleryBrowse ProductsView Product DetailsView FAQsBecome a Member through Registration processView Static PagesRegistered Member PanelLogin to siteManage AccountMy ProfileMy OrdersBuy Product (Checkout)LogoutAdmin PanelLoginDashboardAdministrator User ManagementSite Member (Customer) ManagementBlind Type ManagementProduct Attribute ManagementProduct ManagementPrice Chart ManagementBanner ManagerOrder Manager

Shipping ManagementFAQ ManagementEmail TemplatesStatic Page content ManagementTax ManagementLocation Management (Country/State/City)System SettingsLogout

Page 19: Ecommerce website with seo optimization

3.3 BROWSER COMPATIBILITYSupported BrowserInternet Explorer 7.0, 8.0Firefox 3.xGoogle ChromeSafari (Windows)

3 Technical Overview3.1 Production EnvironmentThe final tested version of the application will be deployed in the production environment andwill be available to the end users. This will also serve as the staging/QA environment before the first release/Beta of the application.3.2 Development EnvironmentThe development environment will be used for developing and testing future releases of theapplication. The version of the application deployed in the development environment will not be available to the end users and will be accessible only to the developers.The development environment will also serve as the staging/QA environment for subsequentreleases of the application but will not be used for any performance related testing since theserver configurations in the development environment are not intended to replicate theproduction environment and thus will not give an accurate measure of how the application would perform in the production environment.

Technology Stack Software ProductDatabase Server My SQL 5.xOperating system LinuxWeb Server ApacheDevelopment Environment PHP 5.2.x, Smarty, AJAX

Page 20: Ecommerce website with seo optimization

SDLC Spiral Model▹ The spiral model has four phases. A software project repeatedly passes through these phases

in iterations called Spirals.

▹ Identification: This phase starts with gathering the business requirements in the baseline spiral. In the subsequent spirals as the product matures, identification of system requirements, subsystem requirements and unit requirements are all done in this phase.

▹ This also includes understanding the system requirements by continuous communication between the customer and the system analyst. At the end of the spiral the product is deployed in the identified market.

▹ Design:Design phase starts with the conceptual design in the baseline spiral and involves architectural design, logical design of modules, physical product design and final design in the subsequent spirals.

▹ Construct or Build:Construct phase refers to production of the actual software product at every spiral. In the baseline spiral when the product is just thought of and the design is being developed a POC (Proof of Concept) is developed in this phase to get customer feedback.

▹ Then in the subsequent spirals with higher clarity on requirements and design details a working model of the software called build is produced with a version number. These builds are sent to customer for feedback.

▹ Evaluation and Risk Analysis:Risk Analysis includes identifying, estimating, and monitoring technical feasibility and management risks, such as schedule slippage and cost overrun. After testing the build, at the end of first iteration, the customer evaluates the software and provides feedback.

Page 21: Ecommerce website with seo optimization

Following is a diagrammatic representation of spiral model listing the activities in each phase:

Page 22: Ecommerce website with seo optimization

List of Tables:-

Page 23: Ecommerce website with seo optimization

List of Tables:-

Page 24: Ecommerce website with seo optimization

List of Tables:-

Totals no of tables = 38

Page 25: Ecommerce website with seo optimization

Use case Diagram of e-Commerce system

E-commerce system

Customer

Verify credenty information

Register

Login

Browse product

Search product

ciew shopping cart

Add shopping cart

Update customerinfo

verify credit card Check out

*

*

*

*

**

*

*

*

*

*

*

*

*

*

*

Check out«include» «extends»

* *

Sale person

Shipping clerk

Update product info

update inventory

Ship produccts

*

*

*

*

*

*

*

*

Page 26: Ecommerce website with seo optimization

Use case description:Register: If a customer is new user, he can request to register page. A register page open and asks total information about customer and also asks to customer to choose login (email address) and password.Login: The customer can login by enter name and password. The system verifies the name and password matches. If not matches, error messages shows to the customer.Browse products: The customer requests to view the product in product category. The system will display the information about product of selected category.Search product: The customers enter the search product parameters and request a search product. The system search through products category in database and gives information. If not matches, gives fail message. View shopping cart: The customer request to view the shopping cart. The system returns the shopping cart to customer, the price and total price shows to customer.Add shopping cart: When customer finds the product he wants, add to shopping carts. The systems stores and track the information about product.Update customer info: The customer request to update customer info about his name, address…. Etc. If updated information system stores in database which is updated. After purchase one product the payment information stores in current information.Check out: The customer completes the shopping he request to checkout. If the payment information exists the credit card information sends to Credit Verification Company. If credit card information not matches it shows enter valid information or cancel order. If the credit card is valid, the order form will be processed by the system and checkout is complete.

Page 27: Ecommerce website with seo optimization

Use case description:Verify credit card: The credit verification company is validating the credit card information. If the information correct returns to sales person. If not, the customer will be asked to re-input his payment information.Update product info: The sales clerk request to update product info includes price, brand…etc. and system updates in database.Update inventory: The sales clerk request to update inventory. The system update’s in database. Ship product: After getting the order request, sales clerk ships order product to customer within 5 to 6 business days.

Page 28: Ecommerce website with seo optimization

Class Diagram

Page 29: Ecommerce website with seo optimization

Activity Diagram

Page 30: Ecommerce website with seo optimization

Sequence Diagram

Page 31: Ecommerce website with seo optimization

DATA FLOW DIAGRAMS

Page 32: Ecommerce website with seo optimization
Page 33: Ecommerce website with seo optimization

ScreenshortsHomepage 1

Page 34: Ecommerce website with seo optimization

ScreenshortsHomepage 2

Page 35: Ecommerce website with seo optimization

ScreenshortsHomepage 3

Page 36: Ecommerce website with seo optimization

ScreenshortsHomepage 5

Page 37: Ecommerce website with seo optimization

ScreenshortsHomepage 6

Page 38: Ecommerce website with seo optimization

ScreenshortsHomepage 7

Page 39: Ecommerce website with seo optimization

ScreenshortsShop page

Page 40: Ecommerce website with seo optimization

ScreenshortsDetails of homepage

Page 41: Ecommerce website with seo optimization

ScreenshortsAdd to cart page

Page 42: Ecommerce website with seo optimization

ScreenshortsCheckout page

Page 43: Ecommerce website with seo optimization

ScreenshortsOrder pages

Page 44: Ecommerce website with seo optimization

ScreenshortsOrder page 2

Page 45: Ecommerce website with seo optimization

thanks!Any questions?

You can find me at@narayank45