presentation5 - University of Worcester

Download Report

Transcript presentation5 - University of Worcester

E-Commerce Technologies
Richard Henson
University of Worcester
October 2011
Week 5: B2C E-commerce
websites with Shopping Carts
 describe the software & hardware components of
a typical B2C on-line trading system
 describe the stages required to capture an order
on-line, produce an online invoice and receive
payment on-line
 apply a knowledge of the above to design a data
model for the on-line payment system
 explain the crucial role of the website itself in
generating on-line orders and ROI
Systems for On-line Ordering
COULD be achieved via the www in a
number of ways:
 via email
 using a HTML Form that sends “semi-structured”
data to an email address
 using a more sophisticated HTML forms system (a
shopping cart)
» sends data to an on-line product database
» database could be local (client only system) or on a web
server (client-server system)
» data could be processed and presented as an online
» invoice could be linked to a payment system
Order via e-mail
Two possibilities:
using email address given on home page
using a HTML mailto command on the
home page, which allows the email
message header to be generated
In either case…
 a manual system requiring the vendor to
physically read the message and send a reply...
Processes in ordering via e-mail
 initiates communication using email address on
web site
 types out/sends an unstructured message
requesting product(s) displayed on website
 replies with an emailed order
» may have be inputted by hand
 requests some means of payment before
» issues with security of personal data for unencrypted
» may have to be sent by post…
Processes in ordering via a
simple HTML form
Customer presented with product list as a
form on the web page
If properly designed, customer just needs to
 type in a number for qty of each product required
 submit the completed form to the vendor’s email
Because the information is structured, it can
be processed automatically by software at
the server end
Ordering via Shopping Cart
Intention: making ordering products as easy as
possible for the customer
 series a web pages with embedded programming
 all the processing happens “behind the scenes”
Transparency (and EU law!): the customer
should see exactly what they are ordering…
 the database should incorporate a means of
systematically storing customer addresses
 the shopping cart logic should total up the exact
amount the customer will have to pay
E-commerce via E-marketing
& Shopping Cart
A complete e-commerce website system
should fulfill two main functions:
 advertising & promoting the company’s products
 providing a secure and robust system for
encouraging people to buy those products online
Each function is a subsystem in its own right
» Presentation… FRONT END
» behind the scenes scripts, database, etc… BACK END
Shopping System
Front End
Online equivalent of a high street shop
 home page = shop window
 browsing through the product web pages… the
equivalent of walking round the shop
Objective (should be!)
 use creative web page design to present
products as positively as possible
» to encourage customers to want to buy…
» and to increase “hit rate”
 provide a “buy” button in appropriate places!
The Shopping System
Back End
The components that communicate with the
remote web server:
 relational database holding product, transaction, and
possibly customer data
 server scripts to manipulate that data, including…
» connectivity string(s) to enable scripts to interact with
» SQL statements to query fields and tables
Often regarded as “the boring bit!”
 but should all work perfectly, and never really be
» “transparent to the user”
Linking Front-End
and Back-End
Where the shopping
cart system becomes
 cart data held locally
for quickness
 cart display gives
customer immediate
feedback on what has
already been bought
Front end
(products on view)
Cart data
Processing allowing
Payment & Fulfillment
The “after ordering” or “customer service” web
pages (especially important in B2C)
 reports progress of order, points out problems
 should “look good”, to maintain the customer’s
confidence in the company as an online vendor
Consist of...
 secure payment pages, that connect to a clearly
identified (logo?) merchant services provider
 corporate “thank you” page
 system to email customer with information
concerning the acceptance & progress of their order
Shopping Cart Logic
The cart itself has to:
collect the order using information
gathered by mouse clicks on shopping
store & process the order data
prepare online invoice
display invoice for customer
request some means of payment
Using local datasets & cookies
E-commerce is very big business
 no expense spared in providing the best customer
 aim for rapid interaction, good security, minimal
customer effort, fast response
 in this case “small is beautiful”, because small
means fast…
Makes sense to make shopping cart dataset
(“VIEW” of database) as simple as possible
Typical B2C
shopping cart system… (1)
Web page displays live data from
organisational web server
 customer selects product(s) and qty using
hyperlinks/buttons on product pages
 data from selections stored locally on cart dataset
 new page created to display cart data
 totals, including VAT automatically displayed on
on-line order (not yet an invoice – by convention,
no customer details included on dataset)
Typical B2C
shopping cart system… (2)
 customer chooses to buy (or not!) directly using
button/hyperlink on on-line order
 System requires customer to either:
» log on so existing customer record can be accessed
» supply new details on a new (preferably secure) web
form, and details need to saved securely before
 system presents on-line invoice, and requests
Typical B2C
shopping cart system… (3)
The invoice has to comply with EU
legislation (other legislation, for
purchases outside the EU
no further charges beyond this point…
terms & conditions clearly displayed
customer personal data suitably protected
Hyperlink/button from online invoice to
payment & fulfillment pages
Shop@ssistant resource: essential
features of a shopping cart
Default shopping pages supplied - readily
 e.g. buttons, text, pictures etc.
 important for meeting client needs!
Good practice:
 enforces reading of “terms & conditions”
 automatically displays shopping cart contents whenever
forms data is added
 captures customer data later in the process
 handles tax and shipping for overseas customers
 scope to link with banking network via secure payment
systems, with built-in links
» security of financial data handled by a trusted third party!!!
Shop@ssistant System
Architecture (if interested…)
Very confusing because it uses several instances of index.html
 root folder file boots the main system file, in the system folder
 causes the system to be loaded
» a web page informs that “Shop@ssistant system is being loaded…”
 finally, the home page is loaded from the pages folder
Product Data
 saved within product pages as JavaScript arrays
Shopping Cart Data
 set up on local hard disk as a cookie
» NOT a session cookie
» data remains after user has logged out, and system has been switched
 cookie values put there by customer clicking on a pay button
Cart page itself created by calling a JavaScript routine, and
placing cookie values into a HTML table
 other features are also JavaScript routines
“Bookshop”– e.g. of shopping
system design
Very simple design...
 enables ordering of a book in at least two ways
» text or image
Easy navigation:
forward (buttons at the bottom of the page)
back (hyperlinks at top and bottom)
Buttons at the bottom of the page:
 Order this Book
 3 Copies for 2 Offer
 Review Basket
Shop@ssistant “Bookshop”
Site design (more…)
Clicking on either the image of the book or
the order button displays “shopping basket”
Features to note:
 heading - reflect corporate image, etc.
 buttons at top of every page - good navigation
 hyperlink on product pages for more detail
 option to go to payment page - cashier
 “remove item” check box
 separate form: on-line invoice
 bullet pointed help
“Bookshop” Site Design
On Screen Invoice
Dealing with Customer Details…
 Based on “buy” hyperlink
» i.e. customer commitment to a purchase
 customer has to appropriately complete name,
address, email address fields (all validated)
“Next” from customer details selectively
provides an invoice:
 if customer details are not in the right format…
» customer details page will instead be called
On screen invoice page:
 includes all extra charges (e.g. shipping and VAT)
 pay button to go to “merchant” site for payment
Handling Payment
After payment, fulfillment…
thank you page
then a goodbye page…
and (optionally) an email confirmation of
» independent of whether payment has been
Not bad for mid-1990s!!
(wonder how much the developer was
Security and E-commerce
Focused mostly on financial transaction
 system needs to be designed so financial data
cannot be tapped into en route or on either client
or server computer
 quite a challenge for a developer… often passed
to 3rd party provider
» e.g. PayPal, WorldPay
However…customer requirement to supply
personal data
 need for protection of such data under EU
» many systems based on US model (no data protection
legislation). Note that Shop@ssistant was British
» still on “catch up” as regards shopping cart design…
Developing your own cart
Many possible solutions…
 Many “skeletal” shopping cart systems
already created
shopping cart components that just need to
be assembled into a unique system
» Charon Cart (asp)
» Webthang (asp,
» WebXel (
Still available for a “fall back” position
Developing a Shopping Cart
with Visual Studio
Need data source controls & general
controls to coordinate button logic
Also needs HTML
 tables now frowned on by (some) client-side
 really useful for server-side
Best data source control for working with
HTML tables: <asp:repeater>
Use of ASP:Repeater
Only limited use of a wizard
 manual use of <table> and <itemtemplate>
 Syntax (hard coded):
» <asp:Repeater ID="Repeater1" runat="server“
<table> <tr> </HeaderTemplate>
<ItemTemplate> <td><%# Eval("CategoryName")
%></td> </ItemTemplate>
<FooterTemplate> </tr>
</table> </FooterTemplate>
Making a Start…
Which comes first… the chicken or the egg?
i.e. Which to develop first… database or
server scripts?
Generally considered to be a good idea to
start with the data…
 that means:
» identifying the ENTITIES
» modelling their relationships
» Adding the ATTRIBUTES
The Data Model for a
Shopping System
Basic Entities:
Link Entities:
All four need to be logically linked in an
appropriate way…
Possible basic data (entity)
model for a Shopping System
Need to add
1-many ends of
Order line
Where does
Shopping Cart fit in?
Possible Data Model with
entities/attributes added
Creating the Physical Database
from a Logical Design
It works on paper…
 But a practical working model is needed:
create database tables
link them together, according to the
Entity/relationships/attributes model you
populate the tables with trial data of an
appropriate format
make sure all is consistent…
Which Fields are necessary
for the shopping cart?
These will be used as a dataset, held as a
cookie on the local machine
 needs to be the minimum number
 needs to be non-sensitive data (held on local
Which data is needed for a shopping cart?
 the corresponding fields are what is required…
 over to you… (something to do in study week)
Justifying the Cost of a
Shopping Cart System
Many ways to create a shopping cart system:
 how does the business know what is good value
for money?
 Internet or cloud-based systems may look
» may appear to be cheaper
» may appear to manage everything for the business
 how well does outsourcing fit with
» business objectives
» legal & regulatory requirements
Business Benefits of B2C
Can generate more sales…
increase revenue
BUT how can B2C e-commerce cut
data input is done by the customer
» help from the shopping pages and shopping
data output is presented directly on the
cuts greatly on administration…
What makes a successful
on-line B2C E-commerce site?
Needs to attract customers
 and retain customers…
 measured through hit rate
Good design principles:
 common “look and feel”
 shopping pages tasteful, but not over-elaborate
 shopping system user-friendly & works efficiently
Successful e-commerce websites save/make the
vendor an awful lot of money!
 potentially huge ROI (wise developer requests a cut?)
B2C E-commerce: Keeping
the customer satisfied…
All transaction data has to be presented
digitally on-screen…
 order forms (no opening envelopes and processing
an order from paper)
 invoices (no need to print them, put them into
envelopes, or send them off by post)
Huge potential cost saving, but the screen
interface must be designed FOR THE
If the customer is not comfortable with it, they
may not buy… and may not return
Internet Marketing
Huge growth area…
 Whole conferences devoted to e.g. “Technologies
for Marketing”
In the early days of e-commerce, the rate of
hits on website WAS the value of the
company (!)
 now revised downwards, but same principle
» formula based on (say) every tenth visitor will be a
Best ways to attract visitors:
 use search engines effectively
 advertise URL effectively using a diverse range of
Promoting the Website
However excellent the site may be…
the business will get no benefits from
increase in sales if there are no visitors (!)
MANY ways to maximise the number of
visitors to a site…
 Suggestions?
Ways to
Improving Hit Rate
Many applications available
 Some very simple
meta name generators
date/time/special effects, etc. (client end)
links to code located on other sides (e.g weather
» provide more features for the site
any number of possibilities
 Others more technological/sophisticated :
» example: ASP Sheriff
Effective Use of Search Engines
Objective: to use appropriate
techniques to cause the search engine
display your site in its “top ten”
Search Engine “spiders”
» crawl round the net looking out for keywords in
web pages
» retrieve keywords and corresponding URLs
» take keywords back to the search engine
» Program automatically adds the lists of
keywords to the database
right keywords MUST be presented to the spiders
Effective Use of
Search Engines (2)
Longer-term Search Engine ranking also
based on:
 hit rate
 number, and activity, of external links on site
Technologies available to help boost rankings
 whole discipline e-marketing technology focuses
on improving hit rate…
 Like e-commerce itself this is now VERY BIG