E-Commerce Site Design

1. E-Commerce Site Design • Format of session: • Introduction • Appreciation of design • how to go about it? • Benchmark other sites • Draw up a checklist of features • Designing for visitors • Tips for good design • Leads into next week’s session on tools ©Staffordshire University

2. Introduction • The design of E-Commerce sites includes: • Designing for usability/interface • The use of colours and screen “furniture” • Research Jakob Neilson • Performance issues including browser compatibility • Communication issues • Can we quantify the above into a benchmark assessment list? • Debate with class using the following examples • Oddbins; Virginwines; MorganComputers ©Staffordshire University

3. E-Commerce Site Design • Research shows content is king! - not just how it looks • Think about it - why do you use certain sites? • Site design techniques • benchmark other sites to get ideas • follow an analysis/design methodology - see “web specification template in week 5” • nothing like learning from experience! ©Staffordshire University

4. The structure of the site • Need to design a structure of the site …a site map • Usually a hierarchy starting with the index page • Pages link from page to page using hyperlinks • You need pages showing the products for sale • A Shopping basket which interacts with these pages • Mal’s E-Commerce for example • Payment transaction services interaction • Pages to deal with this • Mal’s E-Commerce • Payment Service Provider (next weeks topic) • There will be other pages but this is up to you to derive for the assignment ……that is the design aspect ….what features of the site you intend to form part of the design ….this is where benchmarking other sites is so useful …see the practical sheet for this week ©Staffordshire University

5. Design with for the process • A site should have an script for the process of E-Commerce • Business Process Modelling can help here • The script may at first seem quite simple: • Select product • Place in basket • Confirm basket and move to payment page • Confirm transaction • On a more complex footing can involve a whole process within the business e.g e-procurement ©Staffordshire University

6. Documenting the structure • It is useful to consider documenting the structure electronically • i.e move from scribbles to something that can be maintained • Various choices exist for doing this • See Visio in the labs for Web Site modelling • Here is a readable document on the subject <link> • Eventually the site map is something that can form part of what the visitor sees …a navigation ©Staffordshire University

7. E-Commerce Site Design • If you have no experience of building web pages then do not worry…the assignment calls for a simple prototype …a collection of pages • 1 way of creating a webpage is just to use Word and save as a webpage – this is acceptable for the assignment • Or • You can learn some basic HTML • There are many “introduction to HTML” sites • Recommended W3Schools site • Or • you use a template building approach from one of the recommended tools – see topic next week and note this is perfectly acceptable for the assignment • You don’t have to know HTML/JavaScript for this module – it is not a development module ©Staffordshire University

8. Designing for visitors • Interaction design is important (huge understatement!) • Think and behave like a customer • know their habits • how do they buy? • Perception of quality • Security - what can we display to get this across? • Can you deliver the product? • Ensure the goods performance as advertised • Complaint/problems will be dealt with - service level • All the above need to be considered for the site design assignment ©Staffordshire University

9. Site design Good pages are usually: - • Quick and easy to navigate • well structured, visually and in their information content • consistent across the site • and obviously built to standards (usually developed in-house). For the assignment you can suggest a design standard • All the above need to be considered for the site design assignment ©Staffordshire University

10. Site design • Graphics • minimise load time and the customer’s telephone bill by reducing waiting time/frustration factor • design for the slowest modem • Restrain/ban use of graphics in early pages • make large graphics a customer option in lower pages • domain name/brand name - if it is “guessable” probably get more hits • NB: USA and domain names for legitimate firms - “dot con sites” – legal environment different to UK ©Staffordshire University

11. Other tips • Under construction - bad impression / turn off • Make sure the links all work! - Test them - a common fault • Bad pages feature • scrolling - users hate having to do extra work • buttons which don’t work • make sure site can be found - avoid error 404! • large graphic files - thumbnail them or make them a choice • avoid building one page only sites • irrelevant or boring information (interest only internally) • no telephone or email info or even address/map etc ©Staffordshire University

12. Other tips • Good pages may feature • well designed yet very compact graphics (file size small) • Called Thumbnails • appropriate multimedia / movies / sound but be careful with this design feature • A nice to have but may not be necessary • Think – how many of you skip a multimedia intro to a website ….I certainly do! ©Staffordshire University

13. e-Business and BPR • From a wider picture …… • e-Business can act as a catalyst (key enabler) for Business Process Re-engineering (BPR) - why? <Discuss> • We can identify customer related Critical Success Factors(CSF), eg. Accounts Receivable • queries dealt with? • delivery performance like time and shortages/discrepancies • Can e-Business improve the business? Interesting……. • e-Business activity requires a review of business processes - why? • Let us look at a topical e-business issues like e-procurement ©Staffordshire University

14. E-Procurement • Electronic business is the use of internet technologies to conduct business transactions. • Much media attention has been paid to business to consumer (B2C) transactions but for this session we are going to pay attention to the business to business (B2B) transactions. • We are particularly interested in the automation of the procurement chain - product selection, order placement (purchasing), tracking and delivery details. ©Staffordshire University

15. Rationale • The premise is that businesses can save time and money by buying on the internet • A growing number of things that a business would source through traditional means are now available online • Old rules of stocking and distribution do not apply • New market framework ©Staffordshire University

16. Opportunities • On-line catalogues. • applying electronic data interchange (EDI) on the web (maybe using XML). • Supply chain automation to cope with the orders generated from an e-Business site. • Improving procurement - buying costs money - not just the items but the admin to create the order - has to be in proportion the value of items. • With buying on the web comparison of suppliers’ prices is possible online (benchmarking may be easier). ©Staffordshire University

17. Opportunities Strategic purchase by using: • aggregate buying. • volume discounts from suppliers. • lowered transactions costs through use of the internet for core products and non-core products. • Recent research by Warwick University suggests e-Business is 50% cheaper than equivalent manual process! ©Staffordshire University

18. How can it be cheaper? • Automated validation of pre-approved spending budgets for individuals or departments • Fewer people processing each order • Takes less time • So, overall admin costs significantly lower (a third lower?) • Question - what is the average cost of processing an item in your firm? ©Staffordshire University

19. Traditional EDI vs Internet Procurement • EDI has made a name for itself among large companies for direct goods procurement • Recently, however, its use in this area has been threatened by business-to-business e-commerce • Web-enabled procurement systems - a powerful competitor to EDI • Web-enabled procurement systems are cheaper, easier to use • Starting to see a migration from EDI to Internet Procurement systems ©Staffordshire University

20. E-Procurement • Allows all aspects of the purchasing process to be tracked with all suppliers • Creates access to new suppliers and trading networks • Breaks down the barriers of access for global suppliers ©Staffordshire University

21. B2B Issues • Do buyers and sellers share an identical model of the business being transacted? • Do buyer and seller know each other’s goals and expectations? • We are interested in the purchasing professionals within organisations and their suppliers • Purchase-centric commerce systems like the Ariba - Operating Resource Management ©Staffordshire University

22. Supply Chain Management • How can we “integrate” our suppliers? • Real time operation • e-Business supply chain opens up global buying • Removes some of the time lags on supply delivery • Efficiency gains pass on to customer ©Staffordshire University

23. Summary • Thinking about design is worth it • We need to specify our intention • Various methods exist for design • Paper mock up of the site pages • Or use a modelling tool like Visio • Or do a mock up of a the pages of the site in HTML or an e-commerce tool • All of the above rely on thinking about design rather than the method chosen ©Staffordshire University