Mm Interactive Assigment C V 2.5

  • 1,193 views
Uploaded on

Project of multimedia interactive application multimedia interactive application conceptual and logical design, organizational chart, page design and implementation prototype

Project of multimedia interactive application multimedia interactive application conceptual and logical design, organizational chart, page design and implementation prototype

More in: Technology , Business
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
1,193
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
23
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Politecnico di Milano _____________________________________________________________________ Politecnico Di Milano Polo Regionale di Como ________________________________________________________________________ MULTIMEDIA INTERACTIVE APPLICATIONS FOR THE WEB AND MOBILE DEVICES 2007-2008 Assignment C: Design and Prototype Implementation of online Electronics shop for web channel and mobile Device Supervisor: Prof. Paolini Paolo Submission Date: 06/02/2008 Submitted By ********************************************************************* ID: 707241 ID: 707775 Ferdous Mohammad Jannatul Shill Pintu Chandra MS in Computer Engineering MS in Computer Engineering Prof Paolini Paolo
  • 2. Politecnico di Milano Index PAGE Executive Summery………………………………………………………...………………….3 1. Requirement Analysis……………………………………………………...………………..4 1.1 Stakeholders ………………………………………………………...……………..4 1.1.1 Clients ………………………………………………………..………….4 1.1.2 Users…………………………………………………………...…………4 1.2 Interview……………………………………………………………………...……4 1.2.1 Interview Video…………………………………………………………….....4 1.2.2 Plain text format of interview summery……………………………………...5 1.3 User Survey……………………………………………………………………...…6 1.3.1 Questionnaires…………………………………………………………...…6 1.3.2 Analyze Data and Result…………………………………………………...9 1.4 User Profiles………………………………………………………………………12 1.5 Goals…………………………………………………………………………..….12 1.6 Design Consideration and Business Requirements……………………………….13 1.7 Content……………………………………………………………………………14 1.8 Matrix: Users vs. Goal……………………………………………………………15 1.9 Scenarios………………………………………………………………………….15 2. Design for web application………………………………………………………………...16 2.1 Conceptual…………………………………………………………………….….16 2.1.1 Diagram……………………………………………………………..…..16 2.1.2 Textual description……………………………………………………...18 2.2 Logical…………………………………………………………………………....20 2.1.1 Diagram……………………………………………………………..…..20 2.1.2 Textual description………………………………………………….…..22 2.3 Organization of the whole website………………………………………………..25 2.4 Landmarks………………………………………………………………………...27 2.5 Homepage Design………………………………………………………………..28 2.6 Other Page Design ……………………………………………………………….29 3. Design for mobile web interface………………………………………………………...... 36 3.1 Conceptual………………………………………………………………………..36 3.1.1 Diagram………………………………………………………………....36 3.1.2 Textual description……………………………………………………..38 3.2 Logical…………………………………………………………………………....39 3.2.1 Diagram………………………………………………………………....39 3.2.2 Textual description……………………………………………………...41 3.3 Organization of the whole website………………………………………………..43 3.4 Landmarks………………………………………………………………………...45 3.5 Homepage Design………………………………………………………………...46 3.6 Other Page Design ………………………………………………………….……47 4. Prototype application………………………………………………………………………53 4.1 Technology and Tools…………………………………………………………….53 4.1.1 Web application………………………………………………………...53 4.1.2 Mobile Web application………………………………………………...53 4.2 Sample screenshot of the web…………………………………………………….54 4.3 Sample screenshot of the mobile…………………………………………………57 5. Conclusions……………………………………………………………………………….59 Appendix…………………………………………………………………………………...…60 Prof Paolini Paol 2
  • 3. Politecnico di Milano Executive Summery The goal of this project was to identify goal & user segments, taking stakeholder interview to gather requirement, user survey, scenario, services of the on line electronics shopping in the requirement analysis phase and establish a conceptual, logical, overall structural organization (page design) in the design phase, implementing interactive prototype or mock-up of online electronics shopping website for both mobile and web channel. In the online electronics shopping, the principal contents are identified by electronics products, brands of the electronics products, category of the products and services of the company. Some additional contents are present to provide general information about the selling company, shopping instruction, payments, customer support, shipping rates, returns policy, privacy statements and contacts. Actually, online electronics shopping company attracts the potential customers with specific brand, category, payment methods and delivery their services. In the conceptual design where the content of the on line electronics shopping website is partitioned into single topics such as contacts, company, shopping instructions, payments, customer support etc. and multiple topics such as product, brand etc. and the relevant relation such as makes etc. between the multiple topics. In order to navigation purpose, conceptual design also represents some group of topics such as all products, products by category, products by discount, products by price range, price ranges, all brands, all services, special offer products etc. The customer can navigate from the brands of the related products and from the products to their brand. They can also navigate the category, discount and price ranges of the products. Special collections of products are available for the user that are offer some special occasion such as Christmas with special offer products, products ordered by price range and a selected products to buy that keeps track of the products that the clients wants to buy. In the logical design where the single, multiple topics and group of topics of the website both in web and mobile channel are organized in a detail way using dialog act and navigation are shown. The content, editorial plan and motivation of the single and multiple topics are also presents in a detail and specific way. Overall structural organization of the website and landmarks such as all brands, all services, products by category etc. of the online shop website are identified in a specific way with the details of each topics and of the navigation. Homepage and sketches of the online electronics shopping website main pages design where the logical design is translated into pages of the website. Figure 1: Flow chart of the project phases Finally, the prototype is implemented according to design including main pages and navigation using complete development environment as example and some of screen shot is attached with this document. Figure 1 is showing complete phases of this project. Prof Paolini Paol 3
  • 4. Politecnico di Milano 1. Requirement Analysis 1.1 Stakeholders 1.1.1 Clients Company: Rockwell Automation, Milan, Italy is the demo client of the project. 1.1.2 Users U1: Young people: Young people who are interested to buy the electronics products using the website. These young people are divided into the Male and Female. U2: Family: Family buy the household appliances such as TV, Washing machine using the online shop website. U3: Researcher: Researcher who research on the online shopping field to increase the online shopping users and create new opportunity in the online shopping field. U4: Corporate User: Company who buy electronics products for his employee. U5: Student: Students buy the electronics product through on line in the university level. U6: Brand Company: Company who want to provide special offer, promotion, discount as advertising component inside the add section and news area. 1.2 Interview 1.2.1 Interview Video Interviewer: MJ Ferdous, Student of Politecnico Di milano Chair: Lorenzo Cogliati, Project Development Manager, Rockwell Automation Video Link: http://www.youtube.com/watch?v=AgxOrmS63ng Prof Paolini Paol 4
  • 5. Politecnico di Milano 1.2.2 Plain text format of interview summery Ferdous: If we want to develop a new online shopping website, what do you basically want informally from the new website? Lorenzo: What we need from our website, something like to have home page where you can see the main information of the company with some promotion & invitation and in the top can have some navigational link and also available some links in the left side and in the bottom can have less important navigation. Basically, I want the main links in the top and so on the left side should be the complete navigation bar. In addition, we want the user can see all the information regarding the product and also online shopping has to be available so the user can check all the products what we sell and can see all the related information and then also buy this product. This product can be buy all possible payment system. Ferdous: What kind of payment system do you want? Lorenzo: We would like to support credit card which is very important and also all available online payment like bank transfer and so on. Ferdous: How do you want to see the product items like by brand or category? Lorenzo: Basically i concern about the content to place in organized way. Lets say, there could be item placed by category or brand and depend on some technical aspect. Ferdous: You also need the mobile version of that. What do you mostly prefer in the mobile version? Lorenzo: Well, the very important things that the content should be less here and user can navigate our website and buy the product from mobile easily and see the product short description and small image. It should be consistence with the web version. There should not be big difference between mobile and web. Ferdous: So the mobile version also will be accessible like by brand and category. Lorenzo: Yes like the web version. Ferdous: You know there are some technical feasibility for the mobile version. May be something is not possible to implement in the mobile which is implemented in the web. Lorenzo: And you have to solve this problem according to your technical feasibility. Ferdous: Do you have any special advice for both version? Lorenzo: No, Not so much, but I recommend that the content should be simple for the mobile version not too much and try to be more attractive and accessible for the web version. Ferdous: What do you want from the Phase 1 like in the prototyping? Prof Paolini Paol 5
  • 6. Politecnico di Milano Lorenzo: Well, I would like to have to see online shopping for electronic goods for the prototype and implement it. After that we will for next phase. Ferdous: Okay Sir, We will make the requirement according to your speech and talk to you more after that writing the formal requirement. Thank you for your time. 1.3 Users survey The Survey has been taken before Design for both Web and Mobile Channel. It has been performed among student and professional users. It is specially taken for updating part of user profile and placing important content in the design from the user point of view. 1.3.1 Questionnaires Note: If the Answer is not applicable for you then just select none option. You can choose multiple answers in some questions. 1. What is your Salary Range? (Professional) A) Less Than 1500. B) 1500 to 2000 Euro. C) 2100 to 2600 Euro. D) 2700 to 3000 Euro. E) None. 2. What is your education level? (Student) A) School Level. B) Bachelor Level. C) Masters Level. D) Diploma Level E) Others. 3. Do you use any online shopping website, if yes then how many in the last month? A) None B) One times. C) Two times. D) Three times. E) Four times. 4. Do you use mobile or any handheld device internet, if yes what is your preference level online shopping from mobile device? A) None. B) Same as web channel. C) Less than web channel. D) Little less than web channel E) More than web channel. Prof Paolini Paol 6
  • 7. Politecnico di Milano 5. What do you prefer from online shopping website? A) Get the content easily. B) Get the response quickly. C) Get the more colourful interface. D) Get the Transaction easily. E) All the above. 6. How quick do you prefer to get the response after one click in the website? A) Slow. B) Average. C) More than Average. D) Faster. E) More than Faster. 7. Do you access the online shopping for electronics if yes which do you need the most? A) Updated News. B) New Released Electronics Products. C) To see the Electronic Products. D) Buy the Electronics Product. E) All 8. Do you access the online shopping for electronics for mobile or another handheld device, which do you, need the most? A) Updated News. B) New Released Electronics Products. C) To see the Electronic Products. D) Buy the Electronics Product. E) All. 9. What are the payment systems do you use? A) Credit Card. B) Bank Transfer. C) Postal Order System. D) All. 10. What kind of Customer Support do you expect? A) Phone calls. B) Emails. C) Chatting. D) Only FAQs. E) Others. Prof Paolini Paol 7
  • 8. Politecnico di Milano 11. What do you want during browse the product list? A) Product name with Price. B) Product Image with Price. C) Product Name, image and Price. D) Product Name, image, short description and Price. 12. What are the instruction do you want to buy the Products? A) Instructions to buy the products. B) Instructions to Place an Order. C) Instructions to pay the Payments. D) All. 13. What do you like to access the list of Products? A) Products by category, B) Products by discount. C) Products by Price Range. D) All Products. E) All. Figure 1: Screen shot of the online user survey preview from www.surveymonkey.com Prof Paolini Paol 8
  • 9. Politecnico di Milano 1.3.2 Analyze Data and Result Our experimental hypothesis was verified using the collected data from the two groups. One is the professional group and another is the student group. Questions/User Fakrul Liran Sumon Jalal Q1 Not Applicable for Students Q2 C C C C Q3 B B B B Q4 C A D A Q5 E E E E Q6 E D C D Q7 A,B A C A,B Q8 A,B A C A,B Q9 A A A A Q10 A,B B B B Q11 D C D D Q12 D D D D Q13 B B D D Table 1: User Survey result of Student Group Questions/User Valesio Anela Massimo Q1 E C E Q2 Not Applicable for professionals Q3 B B B Q4 C E A Q5 B,D E E Q6 D B B Q7 C,D A C Q8 C A A Q9 A,B,C A,B A Q10 A,B D C Q11 D D C Q12 D A A Q13 D A A Table 2: User Survey result of Professional Group Prof Paolini Paol 9
  • 10. Politecnico di Milano Screen Shot of user Survey (Analysis Data): Prof Paolini Paol 10
  • 11. Politecnico di Milano Design consideration with respect to the Survey: Questions Design Consideration/User Profile Q1 Identify the Salary Range: None Q2 Educational level: Master Q3 Finding online shopping Usage: One times per month. Q4 In respect to the user survey, Web channel preference level is higher than the mobile channel. So we emphasis the web channel contents more than the mobile channel. Q5 Maximum user Get the response quickly. So, we will try to place contents and transaction to keep in mind during design and implementation Q6 User desire response is average to get the webpage. Q7 User sees electronics products mostly. We will basically concern on product contents. Q8 User sees electronics products mostly in mobile channel also. We will basically concern on product contents also. Q9 User use Credit Card for payment system. Credit Card will be first priority in our payment system. Q10 User mostly wants phone call and email for customer support. We will add the feature in the design. Q11 Users want to know the Product name, image, short description and price. So we will consider this matter during design. Q12 Users want to Know how to buy the products in online shopping. So we will give this instruction in our website. Q13 Users browse the products in category wise. So we will consider this during design. Prof Paolini Paol 11
  • 12. Politecnico di Milano 1.4 User Profiles Name: Young People Demographic Description: Age: 25 to 55. Gender: Male or Female. Educational Level: Masters educated. Income and purchasing Power: 2000-3000 Euro per month. Location: Spread all out all over the world where the internet is available. Culture: Culture and speaking language not affect the use and buy the electronics product. Priority: One. Goal: To buy the electronics products through web and mobile channel. Name: Family Family Members: 4-5 Short Description of Family Members: Generally Two Children with Father and Mother. Age: Father and Mother Age is the between 30 to 45 and children age below the 18. Income and Purchasing Power: The family member’s income level is 2000 to 3000 and their purchasing power is high. Location: Spread all over the world where the internet is available. Cultural: Culture and speaking language not affect the use and buy the electronics product. Priority: Two Goal: To buy the attractive household appliance such as TV, washing machine through the online electronics shop website. Name: Student Demographic Description: Age: 18-25 Income and purchasing Power: Students who works in part-time their purchasing power is high and students who are totally depend on the family their purchasing power is less. Location: University. Priority: Three Goal: To see the advertisement, Special offer and buy the electronics product through online electronics shop website. Name: Corporate Users Demographic Description: Age: 10 to 15. Location: Centre in a city. Priority: Two. Goal: To buy the electronics products for his employee. 1.5 Goals General Goal: GG1: User Attraction: Attract the potential customer with specific brand and categories of product or product line at a competitive price as in non-electronics commerce. Prof Paolini Paol 12
  • 13. Politecnico di Milano GG2: Payment policy: Impress the specific user with acceptable payment methods like as credits cards and postal order Service. GG3: Advertisements: Sending advertisements, special offers to the potential customers for some specific occasion like as Christmas. GG4: Compare products and Price: Online electronics shop allows people to browse through many items and categories, to compare the prices and products of as many shops as they want. Business Goals: BG1: Cost and Efficiency: To offer incomparable lower operation costs and higher efficiency, comparing to the standard electronics shop. Customer order as many items as they can afford without having to worry about how they will transport them, because the online electronics shop websites also deliver the things to the buyer’s home. BG2: Online Service: To offer non-stop service, 24 hours a day and 7 days in week comparing to the standard electronics shop because of the Internet is open 24 hours a day, 365 days a year and 7 days in a week. 1.6 Design Consideration and business Requirements The online shop is a web-based application that provides customers with online shopping. Through a Web browser, a customer can browse the catalog, place items to purchase into a virtual shopping cart, create and sign in to a user account, and purchase the shopping cart contents by placing an order with a credit card or postal order system. The application of the online shop is also characterized by the easy control for the customers. The online shop provides well arranged purchasing system and actual information customer’s new and former orders. The whole system is highly adjustable, in means of graphical and functional aspects according to the customers needs. The operations of the online Store are as follows. C) R1: The users can log-in as a new or existing user and edit their details (name, address, e-mail address, credit card type and number, phone). D) R2: The users can browse all the items of the number of products that belong to several different categories. E) R3: The users can do key-word search on all products, which returns the list of all products that contain the provided word (string) in their name or description fields. F) R4: Only products that have items in stock are displayed to the user. G) R5: The user can add one or more quantities of the same or different items into his/her order. If the user adds the same item into his/her order more than once, the system only increases the quantity of the item instead of adding the same item multiple times. H) R6: When the user selects to add the certain quantity of an Item in to the order, the system sends a message to the item component in order to reduce the required quantity from stock. Prof Paolini Paol 13
  • 14. Politecnico di Milano I) R7: If this operation fails, which means that there aren’t enough items in the stock (taken out by another user browsing concurrently), the operation terminates with a suitable error message. J) R8: If the user tries to add an item into a cancelled order or tries to check out with a cancelled order, the user is informed with a suitable error message and requested to reset their order in order to start with a new order. K) R9: The system checks that the user has enough amount of credit (Check out payment and method) before closing the order. Otherwise the user is informed with a suitable error message and is prevented from proceeding to check out. 10.R10: The user can create an order and add items into his/her order before logging-in, but check out is prevented and the user is requested to log-in in order to proceed with the check-out. 2.7 Content The principal content of the online Store are the products sold in the Store; brands of products and categories of the products. Products: Cell Phone, DVD Player, Digital Camera, MP3 Player, Television & video. Camcorder, iPod, Cassette players, Digital Media Players, Digital Video Recorders. Categories : Communications (Ex. Cell phones, Telephones), Photography (Ex. Digital Cameras), Portable Audio (Ex. MP3 Players, Cassette players), Television & videos (DVD Players, Televisions, Camcorders). Brands : Casio, Nintendo, Nokia, Panasonic, Philips, Pioneer, RCA, Samsung, Sony, Toshiba Electronics, Mitsubishi, Hitachi. Products (List of Products): Contents of the list of Products are a small picture, brand, category, price and general description hyperlinks. Products (Specific Product): General Description of each specific product contains a big image with different angle, Product Description, history, Customers Comment hyperlinks, Price, available number of items, available color selling rate, adds to cart hyperlink, category, Brand of the product. Products (Full Specifications): Type, Media Supported, Features, Additional Features, Connectors, General Product information i.e. weight, model, Dimension etc. Shopping Cart: Contains information about selected products to buy, short description about product, Edit shopping cart hyperlinks. Customer Support: Contains customer support information about maintain product and best way to use products. Shopping Instruction: Information about how to shop in online store, how to place an order. Prof Paolini Paol 14
  • 15. Politecnico di Milano Content of the website also contains general information about the online Store selling company and includes also security information about the transaction. Information about shipping rates, delivery information and payment methods. Contacts information with the online store company. 1.8 Matrix: Goals Vs Users Users/Goal GG1 GG2 GG3 GG4 BG1 BG2 U1 X X X X U2 X X X X U3 X X U4 X X X U5 X X X X U6 X 1.9 Scenario Scenario Name: What is the new electronics product to sell today? User: U1 and U6. Channel: Web and Mobile Application. Description: In the 10 o’clock, Miss Ambia Access the Internet and go to the online electronics shop website and see the latest news that Nokia release the new attractive mobile set. Ambia°s using set is old for this she feel to buy the new mobile set. She reads all the information about the new released mobile set. Motivation: To get the new released electronics product and get information about the lasted model of the electronics product. Scenario Name: Access the online electronics shop website in Bus. User: U2. Channel: Mobile application. Description: Mr. Modon who is the too busy employee in his office. Everday, he has to go home in bus. His family using TV is not good and he has got a profit bonus from his office. For this reason he decides that he will buy a TV. He browses the online electronics shop website and sees the latest model of TV and buys a TV through the electronics shop website. Motivation: To get the latest news about the new released product and buy the product. Scenario Name: What are the special offer products in Christmas Vacation? User: U1 and U6. Channel: web application. Description: In the morning Mr. Kashem accesses the online electronics shop website to get the special offer products in Christmas Vacation. While browsing the special offer products in Christmas vacation, he get that there is 30% discount in washing machine. He decides and thinking to buy the washing machine. In the afternoon, he again browses the online electronics shop website and buy the washing machine. Motivation: To get the latest the news about the special offer products. Scenario: Bargaining in the Restaurant about the Mobile Feature that what is right and what is wrong? Prof Paolini Paol 15
  • 16. Politecnico di Milano User: U1 and U6 Channel: Mobile Application. Description: In the launch time, Mr. Sumon and Mr. Jalal are taking launch in the restaurant. Suddenly, the are discussing about the latest released Nokias 3546 model mobile set. In the dicussing time they are bargaining about the specific feature of a mobile set. Mr. Sumon uses his mobile to access the online electronics shop website in the restaurant. He browses the Nokias 3546 model pages and checks its feature. Motivation: To get the latest released electronics products information. 2. Design for web application 2.1 Conceptual 2.1.1 Diagram Prof Paolini Paol 16
  • 17. Politecnico di Milano RETURNS SITE-MAP SHOPPING PRIVACY CONTACTS POLICY CREDITS INSTRUCTION COMPANY STATEMEN PRODUCT Product by discount Discount Level Shopping Cart Products by Price range Price Ranges All Products Special offer Products Products by Category PAYMEMTS SERVICE Is Made By Makes SHIPPING RATES BRAND All Services FAQ’S CUSTOMER-SUPPORT All Brands Prof Paolini Paol 17
  • 18. Politecnico di Milano 2.1.2 Textural Description Single Topics: Contacts: Content: Contacts information with the online electronics shopping company such as email address, phone number, messenger chatting etc. Returns policy: Content: 15 day returns policy information with the online electronics shop company if you are not completely satisfied with your new purchase from the online electronics shop company. Credits: Content: Information about the online electronics shop website and creators of the application. Site-Map: Content: Information about the whole online electronics shop website navigational links and services that provide to the clients. Shopping Instruction: Content: Information about how to place an order and how to shop with the online electronics shop. Company: Content: Information about the on line electronics shop. Privacy Statement: Content: Information about the privacy statement of your personal data such your address, credit card number etc. Customer Support: Content: Information about the customer support such as best way to clean and maintain your electronics products. Payments: Content: Information about how to pay and online electronics shop provides two type of payment method one is credit card system and another one is postal order system. This topic also contains information that how to pay using credit card and how to pay using postal order. FAQ’s: Content: “Frequently asked Questions” contains information about the general questions that the users feel generally with answers. Shipping Rates: Content: In the online electronics shop all of the products are available for delivery worldwide. This topic contains shipping rates information of different countries. Prof Paolini Paol 18
  • 19. Politecnico di Milano Multiple Topics: Product: Content: Viewing and detailed configuration of product attributes such as name, brand available colour, size with price, available number of items, small picture and category. Specific information of the Product such as Type, Media Supported, Features, Additional Features, Connectors, General Product information i.e. weight, model, Dimension etc. Editorial Plan: Large number of Product. Motivation: To attract the user with different brand and category of the products. Brand: Content: Contains the description of electronics product brand such as name, available size, colour with price and the dimensions of the product. Editorial Plan: 50. Motivation: To attract the user with different type of well known electronics product brand. Service Content: On line electronics shop offer different type of service like as product delivery service to the clients address, support different type of payment methods like as credit card, postal order service and registration as a permanent clients etc. Editorial Plan: 4. Motivation: To attract the user with different type of payment methods, product delivery and registration service. Introductory Acts: All Products: All the Products that are selling in the online electronics shop. Shopping Cart: In order to buy Products, Products are selected by the clients. Products by price range: Products that has the same price range. Ranges of price: Range to which the price of Products can belonging to. Special offer Products: Products that are sell in a special offer (Low price in the shop). Products by discount: Products that has the same % discount. Products by Category: Products that has the same category. All Brands: All the Product brands that are selling in the on line electronic shop. All Services: All the Services of product that are provide by online electronic Shop Company. Prof Paolini Paol 19
  • 20. Politecnico di Milano Relevant Transactional Relations: Makes: The “Makes” transactional relation represents that the brand makes the Product. Is Made By: The “Is Made by” transactional relation represents that the Product is made by brand. 2.2 Logical Design 2.2.1 Diagram Prof Paolini Paol 20
  • 21. Politecnico di Milano RETURNS SHOPPING COMPANY CONTACTS POLICY CREDITS SITE-MAP INSTRUCTION History Contacts General Information Credits Whole Website General Information Information Vision How to Place an Order Who we are PRODUCT Products by discount Discount Level Shopping Cart Products by Price range Price Ranges Basic Description All Products Special offer Products Detailed Description Products by Category PAYMEMTS Image SERVICE General Description Is Made By Makes 1: 1 General Information 1: n SHIPPING RATES BRAND General Description All Services General Description FAQ’S PRIVACY CUSTOMER-SUPPORT STATEMENT General Description General Description General Infomation All Brands Contacts Prof Paolini Paol 21
  • 22. Politecnico di Milano 2.2.2 Textual Description Dialogue Acts: Single Topic: Contacts: Contacts: This dialogue act provides the lists of contacts that can be used to get in touch with the company. It includes from 4 to 5contacts. Returns Policy: General Information: This dialogue act Contains the information about the 15 days returns policy with the online electronics shop if you are not completely satisfied with your new purchase. It includes about 10 to 15lines of text. Credits: Credits: This dialogue act represents the information about the online electronics shop website and its staff. It includes about 10 to 15 lines of text with some small pictures. Site-Map: Whole Website Information: The whole website information dialogue act offers the lists of available hyperlinks that provide the website. Clients can access the whole website using the list of hyperlinks. It includes about 15 to 20 hyperlinks. Shopping: General Information: This dialogue act offers instructions about how to shop online with the online electronics shop website. It includes about 10 lines of text with images. This is the default act for the topic Shopping. How to Place an Order: This dialogue act provides the information that how clients place an order, dispatching information and information that clients can place an order by telephone. This dialogue act includes 15 to 20 lines of text. Company: History: This dialogue act contains a brief history of the company with principal steps in the development of the on line electronics shop. It includes about 15 to 20 lines of text. Vision: This dialogue act is about the purpose of the company and the kind of customers their service is addressed to. It includes about 15 to 20 lines of text. Who we are: This dialogue act contains general information about the company and its staff. It includes about 15 to 20 lines of text and two or three pictures of the building where the operative office is located. This is the default act for the topic Company. Customer Support: General information: This dialogue act offers an introduction about the support offered to the customers of the online electronics shop in case they have problems with a product they have bought. It includes about 15 lines of text. This is the default dialogue act for the topic Customer Support. Prof Paolini Paol 22
  • 23. Politecnico di Milano Contacts: This dialogue act gathers all the contacts that the customer can use if he needs support, including phone numbers and email addresses. It includes from 3 to 5 contacts with one line’s description. Payments: General Description: This dialogue act provides the payment information, payment methods and the address of the postal order services. It includes from 10 to 15 texts with postal order service address. FAQ’s: General Description: This dialogue act contains the general problems that the user faces. It Includes 15 to 20 text based general questions with answer. Privacy Statement: General Description: This dialogue act contains the general information about the privacy statement of your personal data such as your address, credit card number etc. It Includes 15 to 20 text. Shipping Rates: General Description: This dialogue act contains the information about the shipping rates of different countries. It Includes 15 to 20 text based with shipping rates table. Multiple Topics: Product: Basic Description: This dialogue act contains the basic information about a product sold in the online electronics shop, including name, model and price. It includes one or two lines of text and a small picture. This is the default dialogue act for the multiple topics Product. Detailed Description: This dialogue act presents detailed information about the Product, with brand and available sizes. It includes about 15 lines of text. Image: This dialogue act presents a big image of the Product. It is composed by a high-resolution picture and two or three lines of textual description. Brand: General Description: This dialogue act offers relevant information about a brand that produces Product sold in the online electronics shop. It includes about 5 lines of text and some hyperlinks with attractive image. Service: General Information: This dialogue act contains general information about services that online electronics Shop Company provides. It includes 10 to 15 lines of text with image. Prof Paolini Paol 23
  • 24. Politecnico di Milano Introductory Acts: Product All Products: This Introductory act presents a list of all the Products in the application (300-400). For every Product the brand, category and model are displayed. Default: Alphabetical. User Control: By Price range, category and percentage of discount and brand. User Feature: Filtering. There is also the possibility to search within the list by keyword and model. Navigation: The act follows the index subject strategy which contains the hyperlinks that clients can access the products by using these indexes. Also Navigate using the forward and backward sign. Special offer Products: This introductory act presents a list of products that are offered at a low price (from 10 to 20) with a brief introduction (10 lines). This special offer introductory act mainly provides information for some special occasion like as Christmas etc. For every Products the brand, category and model are displayed. Default: Alphabetical. User Control: By category and brand. User Feature: There is the possibility to search within the list by keyword and model. Navigation: Navigate using Index and the forward and backward sign. The act also follows the mixed subject strategy which contains the hyperlinks and some text that clients can access the special offer Products by using these hyperlinks. Shopping Cart: This introductory act represents a list of Products that have been chosen by the client in order to buy them, with the total amount to be paid. For every product the brand, category and model are displayed. Default: Alphabetical. User Control: Category and brand. Navigation: The act follows the index subject strategy. So navigate using Index. Product by price Range: This introductory act represents a list of Products whose price belongs to the same price range (from 20 to 30 Products). For every product the brand, category and model are displayed. Default: Alphabetical. User Control: By category and Brand. Navigation: Index and Guided tour. Products by Category: This introductory act represents a list of Products whose category belongs to the same category (from 50 to 60 Products). For every Product the brand and model are displayed. Default: Alphabetical. Navigation: Index and Guided tour. Prof Paolini Paol 24
  • 25. Politecnico di Milano User features: There is the possibility to search by category. Products by Discount: This introductory act represents a list of Products whose percentage of discount belongs to the same (from 50 to 60 Products). For every Product the brand, category and model are displayed. Default: Alphabetical. Navigation: Index and Guided tour. User Control: By Category and brand. User features: There is the possibility to search by category. Price ranges: this act presents a list of price ranges to which the price of the products can belong. It contains about 10 ranges. Discount Levels: this act presents a list of discount levels to which the discount level of the products can belong. It contains about 10 levels. Brand: • All Brands: This introductory act presents a list of all the brands in the online electronics shop (from 30 to 40). For every brand the name is displayed. Default: Alphabetical. User Control: By Price range, category and percentage of discount. User Feature: There is the possibility to search within the list by keyword and model. Navigation: The act follows the index subject strategy which contains the hyperlinks that clients can access the products by using these indexes. Also Navigate using the forward and backward sign. Service: All Service: This introductory act presents a list of all the services such as delivery, payment in the online electronics shop (3-4 service). Navigation: The act follows the index subject strategy so navigate using the index. Transition Acts: Brand Makes product (List of Products) Line: This Introductory act presents a list of all the Products in the specific brand (50-100). For every Product the name, small picture and model are displayed. Default: Alphabetical. User Control: By Price range, category and percentage of discount. User Feature: Filtering. There is also the possibility to search within the list by keyword and model. Navigation: The act follows the index subject strategy which contains the hyperlinks that clients can access the Products by using these indexes. Also Navigate using the forward and backward sign (Guided Tour). 2.3 Organization of the whole website Prof Paolini Paol 25
  • 26. Politecnico di Milano Shopping Credits Contacts Site-Map How to place an Shipping Rates Payments FAQ’s Credits Contacts Whole website order General General General Information Description Description Description Returns General Information Policy General Description Company Privacy Statement History Customer Support General Home Description Contacts Who we are Introductory Act General Information Service Service All Products Vision General All Products by Category Information Service Special offer Products Price Ranges Shopping cart Products by discount Special offer Product by Price Shopping All Discount Products Category Ranges cart Products Level Brand All Brands Products by Products by Discount Price Range Brand Makes General Description Legenda Introductory Act Is Made By Product Basic Description Dialogue Act Prof Paolini Paol Transition Act Image Detailed Description 26
  • 27. Politecnico di Milano 2.4 Landmarks Landmarks No.1 (Important): The position of the landmarks no.1 is the top of the every page and follows the top structural navigation. Landmarks No.2 (More Important): The position of the landmarks no.2 is the left side of the every page and follows the left structural navigation. Landmarks No.3 (Less Important): The position of the landmarks no.3 is the bottom of the every page and follows the bottom structural navigation. No. Landmarks Single Topics Group of Topics Position(Page) 1 Important Company. Shopping Cart Top Contacts. Credits. Shopping instruction. Customer Support. Payments. 2 More All Brands. Left All Services. Important Special Offer Products Price ranges. Products by category. All Products Products by discount. 3 Less FAQ’s. Bottom Site-Map Important Shipping Rates. Privacy Statement Returns Policy Prof Paolini Paol 27
  • 28. Politecnico di Milano 2.5 Homepage Design Content: Introduction of the online electronics shop and the Products. Appetizers. Quick links. Advertisement and News links. Landmarks: Links in the top, left, and bottom lateral bar with respect to their importance. Landmarks follow the left, top and bottom structural navigation. Title $ Shopping $ Contacts $ Payments $ Customer Support $ Company $ Products by discount Introduction $ Search Option Some New Release attractive Products picture with $ View all Brands $ View all Category Price $ All Services $ Special offer Products $ Price Ranges $ Site-Map $ Shipping Rate $ help desk $ FAQ’s $ Product Care$ Privacy Statement$ Returns Policy 6.4 Other Pages Design Prof Paolini Paol 28
  • 29. Politecnico di Milano Page No.1 Multiple Topic: Product Dialogue Act: Basic Description Introductory Act: Special offer Products: Accessing the Products with the Special offer Products group Content: Basic description of the Product. Structural links: Image, Detailed Description of the Product, homepage. Subject links: “Next” and “Previous” sign Product in the Special Offer Products group, backward link to the “Special Offer Products” page Transition links: Brand and Service. Landmarks: Links in the top, left, and bottom lateral bar with respect to their importance. Landmarks follow the left, top and bottom structural navigation. Title Important Landmarks Links Basic Description of the Product More Important Detailed Description Landmarks Image Links Less Important Landmarks Links Prof Paolini Paol 29
  • 30. Politecnico di Milano Page No. 2 Multiple Topic: Product Dialogue Act: Detail Description Introductory Act: Special offer Products: Accessing the Products with the Special offer Products group Content: Detailed description of the Product. Structural links: Image, Basic Description, homepage Subject links: Next and Previous Product in the Special offer Product group, backward link to the Special Offer Product page Transition links: Service, Brand Landmarks: Links in the top, left, and bottom lateral bar with respect to their importance. Landmarks follow the left, top and bottom structural navigation. Title Important Landmarks Links Detail Description of the Product More Important Landmarks Basic Description Image Links Less Important Landmarks Links Prof Paolini Paol 30
  • 31. Politecnico di Milano Page No. 3 Multiple Topic: Product. Dialogue Act: Image. Introductory Act: Special offer Products: Accessing the Products with the Special offer Products group Content: Image of the product with font view, side view and bottom view. Structural links: Basic Description, Detailed Description, homepage. Subject links: Next and Previous Product in the Special Offer Products group, backward link to the Special Offer Product page Transition links: Service, Brand Landmarks: Links in the top, left, and bottom lateral bar with respect to their importance. Landmarks follow the left, top and bottom structural navigation. Title Important Landmarks Links Detail Description of the Product More Important Landmarks Basic Description Detailed Description Links Less Important Landmarks Links Prof Paolini Paol 31
  • 32. Politecnico di Milano Page No. 4: Special Offer Products: Content: Introduction and list of Products with price and hyperlinks. Structural links: Home page. Landmarks: Links in the top, left, and bottom lateral bar with respect to their importance. Landmarks follow the left, top and bottom structural navigation. Title Important Landmarks Links Introduction More Important Product1+Small picture Product2+Small picture Producte3+Small picture Landmarks Product4+Small Picture Product5+Small Picture Links Forward and backward sign Search Less Important Landmarks Links Prof Paolini Paol 32
  • 33. Politecnico di Milano Page No. 5 All Brands: Content: list of the brands with hyperlinks Structural links: Home page. Landmarks: Links in the top, left, and bottom lateral bar with respect to their importance. Landmarks follow the left, top and bottom structural navigation. Title Important Landmarks Links More Brand 1 Brand 6 Brand 11 Brand 2 Brand 7 Brand 12 Brand 3 Brand 8 Brand 13 Brand 4 Brand 9 Brand 14 Important Brand 5 Brand 10 Brand 15 Landmarks Links Forward and backward sign Less Important Landmarks Links Prof Paolini Paol 33
  • 34. Politecnico di Milano Page No. 6 For Each Specific Brand: Content: list of the Products in specific brand with small picture as a hyperlinks, price, available colour and dimensions information about the product. Structural links: Home page. Landmarks: Links in the top, left, and bottom lateral bar with respect to their importance. Landmarks follow the left, top and bottom structural navigation. Title Important Landmarks Links More Band Description Important Landmarks Links List of Products Less Important Landmarks Links Prof Paolini Paol 34
  • 35. Politecnico di Milano Page No. 7 History Content: Information about the history of company Structural links: Who we are, Vision, homepage Landmarks: Links in the top, left, and bottom lateral bar with respect to their importance. Landmarks follow the left, top and bottom structural navigation. Title Important Landmarks Links Introduction More Important Landmarks Links Who we are Vision Less Important Landmarks Links Prof Paolini Paol 35
  • 36. Politecnico di Milano Page No. 8 Products by Category Content: Name and small picture of Products with hyperlinks. Structural links: homepage. Subject links: Backward links to the category. Landmarks: Links in the top, left, and bottom lateral bar with respect to their importance. Landmarks follow the left, top and bottom structural navigation. Title Important Landmarks Links List of Category More Important Landmarks Links Forward and Backward Less Important Landmarks Links 3. Design for mobile web interface 3.1 Conceptual 3.1.1 Diagram Prof Paolini Paol 36
  • 37. Politecnico di Milano PAYMEMTS CREDITS COMPANY PRODUCT Products by Category Shopping Cart Special offer Products All Products SHIPPING RATES Makes Is Made By BRAND CUSTOMER-SUPPORT All Brands Prof Paolini Paol 37
  • 38. Politecnico di Milano 3.1.2 Textual description Single Topics: Credits: Content: Information about the creators of the application. Company: Content: Little Information about the on line electronics shopping company. Customer Support: Content: Information about the customer support such as contact information and other customer support. Payments: Content: Information about how to pay and online electronics shop provides two type of payment method one is credit card system and another one is postal order system. Shipping Rates: Content: In the online electronics shopping all of the products are available for delivery worldwide. This topic contains shipping rates information of different countries. Multiple Topics: Product: Content: Viewing and detailed configuration of product attributes such as name, brand available colour, size with price, available number of items, small picture and category. Specific information of the Product such as Type, Media Supported, Features, Additional Features, Connectors etc. Editorial Plan: Large number of Product. Brand: Content: Contains the description of electronics product brand such as name, brand products etc. Editorial Plan: 50. Introductory Acts: All Products: All the Products that are selling in the online electronics shopping company. Special offer products: Products that are sell in a special offer (Low price in the shop). Products by Category: Products that has the same category. All Brands: All the Product brands that are selling in the on line electronic shop. Prof Paolini Paol 38
  • 39. Politecnico di Milano Relevant Transactional Relations: Makes: The “Makes” transactional relation represents that the brand makes the Product. Is Made By: The “Is Made by” transactional relation represents that the Product is made by brand. 3.2 logical Design 3.2.1 Diagram Prof Paolini Paol 39
  • 40. Politecnico di Milano COMPANY CREDITS CUSTOMER-SUPPORT History (Short) Credits Contacts Vision (Short) PRODUCT Short Description Shopping Cart Products by Category Small Picture All Products Special offer Products PAYMEMTS Makes General Description 1: 1 Is Made By 1: n BRAND SHIPPING RATES General Description General Description All Brands Prof Paolini Paol 40
  • 41. Politecnico di Milano 3.2.2 Textual description Dialogue Acts: Single Topic: Credits: Credits: This dialogue act represents the information about the online electronics shop website and its staff. It includes about 5 to 10 lines of text with some small pictures. Company: History: This dialogue act contains a history of the company with principal steps in the development of the on line electronics shop. It includes about 5 to 10 lines of text. Vision: This dialogue act is about the purpose of the company and the kind of customers their service is addressed to. It includes about 5 to 10 lines of text. Customer Support: Contacts: This dialogue act gathers all the contacts that the customer can use if he needs support, including phone numbers and email addresses. It includes from 3 to 5 contacts with one line’s description. Payments: General Description: This dialogue act provides the payment information, payment methods and the address of the postal order services. It includes from 5 to 10 texts with postal order service address. Shipping Rates: General Description: This dialogue act contains the information about the shipping rates of different countries. It Includes only shipping rates table. Multiple Topics: Product: Short Description: This dialogue act contains the basic information about a product sold in the online electronics shop, including name and price. It includes one or two lines of text and a small picture. This is the default dialogue act for the multiple topics Product. Prof Paolini Paol 41
  • 42. Politecnico di Milano Small Picture: This dialogue act presents a small image of the Product. It is composed by a high-resolution picture and one or two lines of textual description. Brand: General Description: This dialogue act offers relevant information about a brand that produces Product sold in the online electronics shop. It includes about 3 lines of text and some hyperlinks with attractive image. Introductory Acts: Product All Products: This Introductory act presents a list of all the Products in the application (300-400). For every Product the brand and category are displayed. Default: Alphabetical. Navigation: The act follows the index subject strategy which contains the hyperlinks that clients can access the products by using these indexes. Also Navigate using the forward and backward sign. Special offer Products: This introductory act presents a list of products that are offered at a low price (from 10 to 20). This special offer introductory act mainly provides information for some special occasion like as Christmas etc. For every Product the brand and category are displayed. Default: Alphabetical. Navigation: Navigate using Index and the forward and backward sign. The act also follows the mixed subject strategy which contains the hyperlinks and some text that clients can access the special offer Products by using these hyperlinks. Shopping Cart: This introductory act represents a list of Products that have been chosen by the client in order to buy them, with the total amount to be paid. For every product the brand and category are displayed. Default: Alphabetical. Navigation: The act follows the index subject strategy. So navigate using Index. Products by Category: This introductory act represents a list of Products whose category belongs to the same category (from 50 to 60 Products). For every Product the brand and model are displayed. Default: Alphabetical. Navigation: Index and Guided tour. Brand: Prof Paolini Paol 42
  • 43. Politecnico di Milano • All Brands: This introductory act presents a list of all the brands in the online electronics shop (from 30 to 40). For every brand the name is displayed. Default: Alphabetical. Navigation: The act follows the index subject strategy which contains the hyperlinks that clients can access the products by using these indexes. Also Navigate using the forward and backward sign. Transition Acts: Brand Makes product (List of Products) Line: This Introductory act presents a list of all the Products in the specific brand (50-100). For every Product the name and small picture are displayed. Default: Alphabetical. Navigation: The act follows the index subject strategy which contains the hyperlinks that clients can access the Products by using these indexes. Also Navigate using the forward and backward sign (Guided Tour). 3.3 Overall Organization of the website Prof Paolini Paol 43
  • 44. Politecnico di Milano Shopping Shipping Rates Payments How to place an General General order Description Description General Information Customer Support Company Contacts Home History General Information Introductory Act All Products Vision Products by Category Special offer Products Shopping cart Special offer Product by Shopping All Products Category cart Products Brand All Brands Brand Makes General Legenda Description Introductory Act Is Made By Product Dialogue Act Short Description Transition Act Prof Paolini Paol Small Picture 44
  • 45. Politecnico di Milano 3.4 Landmarks Landmarks No.1 (Important): The position of the landmarks no.1 is the bottom of the every page and follows the bottom structural navigation. Landmarks No.2 (More Important): The position of the landmarks no.2 is the top of the every page and follows the top structural navigation. No. Landmarks Single Topics Group of Topics Position(Page) 1 Important Company. Bottom Credits. Customer Support. Payments. Shipping Rates. 2 More All Brands. Top Special Offer Products Important Products by category All Products Prof Paolini Paol 45
  • 46. Politecnico di Milano 3.5 Homepage Design Content: Introduction of the online electronics shop and the Products. Appetizers. Quicklinks. Advertisement and News links. Landmarks: Links in the top, and bottom lateral bar with respect to their importance. Landmarks follow the top and bottom structural navigation because of efficient scrolling of mobile device. Title $ View all Brands $ View all Category Introduction $ All Products $ Special offer Products Introduction Some New Release attractive Products picture with price $ Shipping Rate $ Customer Support $ Company $ Credits Prof Paolini Paol 46
  • 47. Politecnico di Milano 3.6 Other Pages Design Page No.1 Multiple Topics: Product Dialogue Act: Short Description Introductory Act: Special offer Products: Accessing the Products with the Special offer Products group Content: Short description of the Product. Structural links: Small Picture. Subject links: “Next” and “Previous” sign Product in the Special Offer Products group, backward link to the “Special Offer Products” page Transition links: Brand. Landmarks: Links in the top, and bottom lateral bar with respect to their importance. Landmarks follow the top and bottom structural navigation because of efficient scrolling of mobile device. Title Less Important Landmarks Links $ View all Brands $ View all Category Introduction $ All Products $ Special offer Products Short Description of the Product Detail Specification Back to the Home $ Shipping Rate $ Customer Support $ Company $ Credits Prof Paolini Paol 47
  • 48. Politecnico di Milano Page No. 2 Multiple Topic: Product. Dialogue Act: Small Picture. Introductory Act: Special offer Products: Accessing the Products with the Special offer Products group Content: Small Picture of the Product with font view, side view and bottom view. Structural links: Short Description, Homepage. Subject links: Next and Previous Product in the Special Offer Products group, backward link to the Special Offer Product page Transition links: Brand Landmarks: Links in the top, and bottom lateral bar with respect to their importance. Landmarks follow the top and bottom structural navigation because of efficient scrolling of mobile device. Title Less Important Landmarks Links $ View all Brands $ View all Category Introduction $ All Products $ Special offer Products Small Picture of the Product Short Description Back to the Home $ Shipping Rates $ Customer Support $ Company $ Credits Prof Paolini Paol 48
  • 49. Politecnico di Milano Page No. 3 Special Offer Products: Content: Introduction and list of Products with Price and hyperlinks. Structural links: Home page. Landmarks. Title Less Important Landmarks Links $ View all Brands $ View all Category Introduction $ All Products $ Special offer Products Introduction Product1+Small picture Product2+Small picture Producte3+Small picture Product4+Small Picture Product5+Small Picture Forward and backward sign Back to the Home $ Shipping Rate $ Customer Support $ Company $ Credits Prof Paolini Paol 49
  • 50. Politecnico di Milano Page No. 4 All Brands: Content: list of the brands with hyperlinks Structural links: Home page. Landmarks Title Less Important Landmarks Links $ View all Brands $ View all Category Introduction $ All Products $ Special offer Products Introduction Brand 1 Brand 2 Brand 3 Brand 4 Brand 5 Forward and backward sign Back to the Home $ Shipping Rate $ Customer Support $ Company $ Credits Prof Paolini Paol 50
  • 51. Politecnico di Milano Page No. 5 History Content: Information about the history of company Structural links: Vision, homepage Landmarks Title Less Important Landmarks Links $ View all Brands $ View all Category Introduction $ All Products $ Special offer Products Introduction Vision Back to the Home $ Shipping Rate $ Customer Support $ Company $ Credits Prof Paolini Paol 51
  • 52. Politecnico di Milano Page No. 6 Products by Category Content: Name and Small Picture of Products with hyperlinks. Structural links: homepage. Subject links: Backward links to the category. Landmarks. Title Less Important Landmarks Links $ View all Brands $ View all Category Introduction $ All Products $ Special offer Products Name and Picture Category Forward and backward sign Bake to the Home $ Shipping Rate $ Customer Support $ Company $ Credits Prof Paolini Paol 52
  • 53. Politecnico di Milano 4. Prototype application 4.1 Technology and Tools 4.1.1 Web application The following technology has been used to develop web application Programming Language: ASP.NET 1.1, C#.NET Scripting Language: JavaScript Markup Language: DHTML Style: CSS (Cascading Style Sheet) IDE: Visual Studio.Net 2003 Web Server: IIS (Internet Information Service) Framework: Dot.net Framework 1.1 Operating System: Windows 2000 or higher (recommended XP SP2) Browser: any 4.1.2 Mobile Web application The following technology has been used to develop mobile web application Programming Language: Mobile ASP.NET 1.1, C#.NET Markup Language: HTML IDE: Visual Studio.Net 2003 Web Server: IIS (Internet Information Service) Framework: Dot.net Framework 1.1 Operating System: Windows 2000 or higher (recommended XP SP2) Browser: Opera mini or any device enabled browser Prof Paolini Paol 53
  • 54. Politecnico di Milano 4.2 Sample screenshot of the web Prof Paolini Paol 54
  • 55. Politecnico di Milano Prof Paolini Paol 55
  • 56. Politecnico di Milano Prof Paolini Paol 56
  • 57. Politecnico di Milano 4.3 Sample screenshot of the mobile Prof Paolini Paol 57
  • 58. Politecnico di Milano Prof Paolini Paol 58
  • 59. Politecnico di Milano 6. Conclusions Finally, this document represented a conceptual schema with single and multiple topics and their mutual relations, a logical schema with the details of each topic and of the navigation, an overall organization of the website map and some sketches of its main pages. Developer and designer can use this as template to design and develop the next phase of the website. And also the prototype has been included with this document (screen shot is attached) which will show how the application interface will be look like. Our future plan is to incorporate other sections of the client with the online shopping system. Prof Paolini Paol 59
  • 60. Politecnico di Milano Appendix Project plan: Prof Paolini Paol 60