The screen design below shows the page that appears once the user has clicked on his/her shopping basket.
The screen design below shows the page that will appear once the user has clicked on the checkout button. The page that appears will be a login page the group have decided. Our website will enable users to choose their products that their interested in and then forward them to a login page which will allow them to pay for their items. This is how that page should look like.
supplies-4-salons design2
supplies-4-salons design2
Changes needed on website from feedback received:
- Colour scheme - too dark can’t see information
- Have validation input - user can enter letters in the quantity box
- No stock check is being checked user can buy unlimited
- User has to go to a different page to see item in basket – same page basket needed simple for user
- Pictures for item on sale
- Admin section needed
- Database re-design may be needed
- Links need to be more clear – linking in with colour scheme
OLD WEBSITE
NEW WEBSITE
The screen design below is the design the group will use for our website. The group have changed our screen designs so that is user friendly with the goals of the HCI which stands for Human–computer interaction. The group have decided to change our colour scheme from blue to pink and green so that the website is more attractive and easier for users to read information. The colour scheme also resembles the products that are for sale. Since the products for sale are for women the group decided to use girl like colours to match them. Our websites audience is mainly for females so the new colour scheme is efficient for their use. By changing the colour scheme the group have aimed to improve the interaction between the users of our website
The screen design below shows the page in our website that will appear once the SORT by price button is clicked from the homepage.
This screen design shown below is how our login page should look like. Customers will need to login to their personal account to purchase items. This page will be simple and easy to use.
The group also plan to have an administration page in our website that only admin will be able to access. This page will have a control panel for the purpose of admin managing their products. They will be able to use services like adding products, adding categories, viewing order etc. the screen design below shows how the group plan to design the administration control panel page.
Once a customer has ordered there product that they want to purchase the admin will be able to access these orders from the control panel. The design of the control panel THE GROUP have shown on the previous page. The admin simply needs to click on the button named Invoice orders and can access all of the orders shown. Once the admin has clicked on the invoice order a page will appear showing the details of that order. The screen design below shows how the group plan to design this page.
Sequence Diagram.vsd
Diagram for supplies 4 salons
Testing
Testing
Survey Question
Survey Result
Survey Chart Information
Testing was done in many methods such as test plans, scenarios testing and surveys. Testing within in the test plan was specified and was tested by a member of the group, this was used to test if the website was fully working and to make sure the group met the user requirements. With the test plan you don’t find out if the website is user friendly because you are testing for errors mainly.
As for the scenarios testing it is very useful because it is done by people outside the group. The advantage of this is that I user from outside the group will use your website according to the scenario and then comment on what they think of the process. The group did scenario test were the group found 2 people with opposite views such as 1 person liked to go to the shopping basket straight after clicking on the item were as the other user liked that it did not take you to the shopping basket and allowed you to carry on shopping. From these result the group realise that different people have different requirements and that our website meets user needs but as they say you can’t keep everyone happy.
Surveys is another way of testing your website, this method allows you to have variety of results for example the group had 10 questions and then the group had 10 different people answering these questions so all together the group have 100 answers this data is very useful to see the difference in peoples views about the website. Using this data the group made a table to hold results and then using this data the group made a bar chart and a pie chart to show percentages.
Overall our testing was very specified and not only done by a member of the group but also users from out side the group and this allowed us to get a better view of the user requirements.
System Back Log
Complete System Back Log
Phase 1
22/02/2010
- Create a website- enable customer to purchase online
- Customer Account- Input customer detail, Generate unique User name and password for customer
- System to hold all customer details- customer name/ Id, customer address, date of birth
- System to hold product details - manufacturers name, description, cost price, sale price, colour, size etc
- Items to be categorised- hair colours, shampoos, conditioners, hair extentions, styling products, styling tools & appliances, hair treatment, brushes, combs etc, hair accessories, clippers & trimmers, shears & shapers etc.
- Sort function for products by name and price- product list in order from A-Z/ Z-A or in order of Highest price - Lowest price/ Lowest price - Highest price
- Stock Details- Quantity & location for each product
- Product quantity reminder- If quantity of product available below 10 then flag as item to be purchased
Phase 2
22/03/2010
- Shopping basket- store item selected and purchased. Also running total in addition to itemised bill
- Generate Invoice- business details, customer details, purchased item list and item details such quantity and price, sub total, delivery charge, discount and total.
- Generate picking list- Customer name/ID, details of items purchased and their stock room location.
- Create a new schedule for the next sprint – Gantt chart showing schedule for this sprint
- Complete the database- make sure the database is complete in the sence that it is working with the function which you choose to implement
- Add data to database for testing - Add all data which will be used for test such as if you are testing are the products visible to customer then u you must have product to test this
- Add data which relevant to functions to make functions work - add data which THE GROUP relevant for each function such as if there is no item with price then how can the group check the sort by price function.
- Add Sort by price function to website- this function will you to sort the price by minimum to maximum or vice-versa
- Add Shopping Basket to website – this will allow customers to see what they want to buy or what they have put in their basket to purchase.
- Add Login function to website – will allow to login in to their accounts
Phase 3
26/04/2010
- Test all functions are fully functional and working – this will take place at the ends once all work to the website is complete to make sure everything work according to requirements
Predicted Gantt chart group
Gantt chart For required website specification
Actual Gantt Chart
Dicussion Bewtween Gantt Charts
Analysis of Gantt charts
To plan our project the group created a Gantt chart showing the list of all the stages the group had to go through to complete the project. In the first Gantt chart the group created the group planned to complete the full website with all of the functions working in 64 days. The group managed to complete it but after feedback the group decided the group needed to change the colour schemes so that the website was user friendly towards the goals of the HCI which stands for Human–computer interaction.
As the group made these sufficient changes it took us an extra 10 days for the completion of the website with all the functions correctly working. As the group made these changes to our website the group decided to create another Gantt chart showing these improvements. The group also created new screen designs showing the changes which the group also mentioned in our new Gantt chart.
As the group made changes to our website the group needed to do extra testing. Once the group had completed our new website the new testing began which the group also had to show in our new Gantt chart. All of these changes set us back as the group had less time to complete tasks and had to make changes in a rush. Although the group had a lack of time to make all of these changes the group completed the full project before the deadline which was very pleasing for all of us due to team cooperation.
Minutes Of Meetings
Object Orientated PHP Information / Tutorial links
Checklist for Supplies 4 Salons System
Research and Analysis on websites
Step 1 – Research on websites
The above website is Amazon .co.uk. This website sells everything from clothes to DVDs and games, the website design I personally found it to be complicated overcrowded and plain. I just didn’t know where to look I am bombarded with ads and deals, but for a company which makes a healthy profit they must be doing something right, I found whilst browsing the website the website tracked the users actions what the user liked and gave similarities and recommendations.
Another website I had a look at was play.com which I was very fond off, it was simple and easy to use with its navigation. It was simple and plain, it had adverts but they were on the side which meant if I didn’t want to look at them I didn’t have to because they were side and there were only a few also the white background complemented the website as it made users focus on the site itself
When I added an item to the basket it showed how many items I had in there the total amount but not the actual items, so as a user I would have to click another link just to see the basket. I found this not user friendly. Unlike Amazon who had a very good basket it showed me all my items and it gave me an option to delete them once I click on edit shopping basket.
I think play.com has a good user friendly website but amazon.co.uk have a good basket function but Amazon don’t make their delivery charges clear as on the other hand lay.com has free delivery which is simple and hassle free, apart from that play.com in my view has a much friendlier site than Amazon, I will investigate and explore play.com in more detail below.
Browsing
The site is easy to navigate it is split into different sections for different items sold. You can search for items you want to buy using the search facility on the website. It is very easy to find your way around the site as everything is set out into a layout. There are nine headings at the top of each page and each heading has its own sub-heading.
The left hand side of each page there is a shopping basket so you can checkout easily with the products you going to purchase you can pay using £ and Euro's you can also pre order items (items you can purchase before they come out this is so that you can be certain that you will receive that product). The top right hand side of the page contains links to help you with your account and a help desk. On the right hand side there are advertisements of the items which are on sale and sold by play.com, competitions, hot picks (items that play.com rate great in value for money) and special offers. The middle of the page is where the main items which they sell come up, so if you click on the DVD category then the DVD's they sell will come up. The bottom of the page shows customers what credit/debit cards are accepted by play.com there terms & conditions and their privacy policy.
The colours used are simple but eye catching; gray and white are mainly used with some orange and red. The colour of the text is black, blue and orange using these colours play.com can make its products stand out and that can attract the customer. Play.com also has selected items which are great for value are named as the "Pick of the Week" each week play.com place different items to show the great value for money they offer. Below is an example of play.com pick of the week. It shows how much the item was and how much they have reduced it by.
The transactional website gives a list of the "Top Sellers" the items which sell the most; "Hot Pick" is if you had to buy an item play.com would recommend the hot pick.
Goods and Services
The goods that play.com sells are:
- DVD's
- Music
- Games
- Books
- Gadgets
- Electronics
- PC's and accessories
- Mobile and accessories
- Clothing
- Tickets
- Toys
- Avatar
- Sell your stuff
- Blu-ray
When you want to buy an item in any of the above categories you just click on the "Buy" button which adds the item(s) to you shopping basket. When you click on a one of the fifteen categories then the advertisements on the left/right side of the page will show related items to the category you are browsing through.
Product Information
You can view more information about the product by clicking on the "More Details" icon which is located next to the product you are interested in. The product will automatically show the following information: the name of the product, play.com's price, Recommended Retail Price, availability, how long it will take to be dispatched and how much money you will save. This is the basic information more Information such as for example if you’re looking at a DVD, can be seen about the DVD are the actors in it, the certificate rating, if the film has subtitles and the duration of the film.
This is a screen shot of a DVD showing customers information.
Techniques used to engage customers
In order to make sales and revenue play.com needs to have customers and keep its customers for as long as possible, it needs to attract customers and engage, retain and entice its customers. if play.com provides good products with good prices it will gain a reputation and more customers will buy from them, so it is important that play.com listen to its customers and provides them with a service which they won't get elsewhere. To do this it needs to engage its customers and there are a lot of different ways in which this can be accomplished. Sales the first thing which engages a customer is play.com’s big red banner this is an eye-catching poster which will attract the customers.
This will hopefully make the customers stay and browse around, it has links to all the major categories with sales and you could save up to 80% which again entices the customer. Also play.com states how much money a person may save if they buy it this may engage the customers as they think they’re getting a good deal and they might purchase that item as well as other items, the print screen below shows how much someone would save, the price is compared with the RRP.
Play.com provides FREE DELIVERY which will engage customers, all of play.com's items are delivered free around the world, most well known transactional website's charge for delivery which may put customers off, but play.com can attract customers,
Play.com is a very big site and browsing for just the one item through the whole site may be frustrating and time consuming, but customers might be engaged through the search facility which speeds up the searching and save time.
Usability & Accessibility
the site accessible and easy to navigate within, there is trouble in reading the writing the text size should be bigger for people who have sight problems, the website does at sometimes feel a bit overcrowded and it does give a headache looking at so much in a small amount of space. To solve this problem the website should have a zoom button to make the text size bigger and more space should be left and the structure of the site should be spread out. The accessibility is good as you can access the site without any trouble and the search facility makes it easier to navigate you way around. The links on the site all work and all the animations and pictures work and show up. Also the menu bar at the top of the page helps the customers find their way around the site.
Conclusion
Overall I think most of my influences for supplies for salons will come from play.com but I will add numerous items from Amazon as well, such as the basket function this way, I will get the best out of both of these successful websites without having to choose just one. As well as that play.com has a variety of products on sale which makes it easier for shoppers as they don't have to go elsewhere to shop, it provided the customers with the appropriate information the structure is good but sometimes the website feels a bit overcrowded there's so much to look at in just a small section, all the links and pages worked as well as the pictures and customers won't get lost as the heading bar at the top was the best way of getting around.
Colours
The colours where engaging and attracted the customers attention, the big red banner at the begging of the site enticed customers. The main colours blue, orange and red were very appealing as they stood out. The text was clear and easy to read but for people who have sight problems I think that the size of the text was too small and would not been able to be read there was no help in this problem and this may put customers off in visiting the site.
Multimedia
there were a lot of multimedia components such as pictures which were necessary as the customers needed to see what they were purchasing, flash animation stood out which was at the top of the page the Free Delivery icon was an animation and some of the advertisements on the left/right hand side columns where mini clips, videos and sounds would have greatly enhanced the interactivity of the site.
Navigation
navigation was very easy as the menu bar at the top and the search facility helped the customer find his way around the site if the customer ever got lost all he/she would need to do is just click on the play.com icon winch was located on the top left hand side of the site and that would have re-directed you to the home page this is quite common amongst lots of website's as most website's have linked every logo on every page where there logo appears so that people visiting the site don't get lost.
Consistency & Accessibility
The site was consistent with its colours and layout throughout the site this never changed which mad the site much easier to navigate around. accessibility the site was very easy to access it could be accessed through a number of search engines including Google which made it easier just in case someone forgot the web address.
Summary
Browsing the site is very easy everything is set out in an appropriate layout and the search facility on the site helps you find products easily. It is very complex in reading the site as everything is squeezed in together and there is so much to look out on each page. The menu bar at the top of the page is a good way of getting around the site it’s always at the top so you won’t get lost.
Effectiveness of the site
Strengths:
- Easy to navigate- menu bar and search facility helped to make this possible.
- Easy payments- allow customers to be able to use a variety of cards.
- Consistency- the site stayed the same throughout.
- Helpful- helpdesk, phone or email would help customers.
- Delivery free delivery including outside the UK.
- Secure shopping- Nat West secures payments and secure shopping certificate.
Weaknesses
- Overcrowded- there was too much information and advertisements on the site.
- Text size- the size of the text was too small would not be able to be seen by people with sight problems.
- Products- there were not a variety of products other sites such as eBay provide more variety.
- Shopping basket don’t shows items only total and number of items.
