Step one

A. My Target

           Primarily the target user group would be people who use computers for entertainment purposes, the system aims to organize and play videos in a simple and convenient manner. These videos may be off different file formats, size and genres.

B. Interface

           In the Online Movie interface, there are four buttons: first one is My Movie, second is My Song, third is Searching and forth is Exit. When the user clicks on My Movie button the system will take him/her to Movie manager where the user can choose a movie from the list of database that I linked with the system and in this page there are nine buttons.  First one in this page is add, this is where you can add new movies. When you click ‘add’ this will take you to your folders and you can choose the movie that you want, you can then add to your list box. Second is the ‘Download’ button where you can download a movie to your computer from the system application. The third button is share where you can share a movie with you friends by email or face book or YouTube. The ‘export’ and ‘import’ buttons are used to help users to export and import movies from and to my computer files. There is an empty slab towards the bottom of the page where the current user can attach a link of a song or a movie, this will then allow the user to upload the link by clicking the button ‘load movie’. The aim of this is to allow the user to watch the movie just uploaded on the screen. A user can also play, pause and stop a movie at any time.

           The song manager screen allows users to share, download, and import and export songs. There is also the download manager screen where users can manage downloads by either entering URL or clicking the submit button or by clicking on one of the song links which are shown on the screen.

           The movie manager screen allows users to share, download, and import and export movie. There is also the download manager screen where users can manage downloads by either entering URL or by clicking the submit button or by clicking on one of the movie links which are shown on the screen.

           In the ‘Add Song’ screen, there are seven textboxes which allow users to enter to see the ID, NAME, LENGTH, FORMAT, COMPANY, and SINGER and RATING of a song. With the ‘Add Movie’ screen, a user can save some details of a movie as there are seven textboxes which are ID, NAME, LENGTH, CATEGORY, COMPANY and DIRECTOR and RATING. When a user downloads a movie, a pop up window will show up saying that the download is successful in order to let the user be aware and more confident.


           This system is designed for both music and video listeners and watchers. Both parts of this system allows the user to listen to whatever music they feel and allows them to save it in to their own storage for example on their personal computer folders. This function can be done by using the import and export buttons made available on the page. With the video part of the system, this allows the user to not only save their videos but also upload their videos. Their own personal watch list allows the user to view any at any time. This function is to make it less time consuming for the user and to also save the trouble of having to look up a movie/or a music file when it can easily appear in their watch list. There is also another function made available to the user where you can save three most commonly used websites where they watch their music/videos. This function is to make it easier for the user to click in to e.g. link 1, link 2, link to import files they may like on to this system. In doing this it will allow the user to save their own watch list instead of having to go back to the website to search for that same file. The last function available to users is the pop up that occurs after an imported file has been added to their watch list. This function has been added on to this system prototype to make the user aware that their import has been successful.

Step one C)

           The first prototype contains many buttons such as play, revised, delete, share and add. However I had to change my system prototype form my paper prototype once commencement started on the creation of the actual software. What I had to change is the removal of some of the function buttons. The reason this was done was to make it clearer and easier for the user to use. This change was also done to make the design aspect more appealing to the user. The other options missed out on the first page/home page from the paper prototype are available when you click in to link buttons on this page. An example of this is when you click the download button on the home page. Below is a screenshot of what other function buttons appear when the download button is clicked.

Scenario picture:

           This scenario is to show how a user can add a link of music or video to their watch list. For adding these files I have not changed much when comparing the paper prototype and system prototype. The adding buttons for my songs or my videos are still on the home page and the search engine tool slab is next to the my songs and my videos buttons for the user to look for certain movies or music through URL links.  Below is a screenshot of the comparisons of paper prototype and system prototype, showing the similarities.

Main page picture:

           This scenario is to show how a user can add a music file and a video file from a link and show how they can add descriptions of this. In comparisons to my paper prototype and system prototype they are nearly exactly the same. There was only one function button that was removed from the paper prototype to the system prototype and this function button is to go back to the main page. The reason I removed this function is because to add the music or video these windows are little pop ups on the main page and the user is able to go back automatically to the main page.

Pictures of adding songs and videos:

Step one D)

           This scenario is to explain how a user can edit details in to their video. When comparing the paper prototype to the system prototype, I have removed this function. I removed this function because I believed that it was not that useful on my software prototype. I did not see the function of revising to be a main feature to this system as all information added with new music folders or video folders should be correct when first entered alongside the new folder.

Editing and saving screenshots:

Picture of choosing a file:

           This is where the user can choose a song or a movie if he/she has on their desktop. The main aspect of this picture diagram is to show the easiness of how a user can add certain folders from their computer instead of having to always go to a website.

Picture of how to download files:

           This is where the user could download and choose any of the movies and songs from favorite sites and that the user could save them if he/she wants to use their favorite sites on a frequent basis

Picture of adding a movie:

           This is where the user could title and but what type of song or movie.

Picture of song manager:

           This is the song manger where the user could play or share or even download any song the user want also the user could play music from internet without download it.

Picture of movie manager:

           This page is movie manager where the user could plays any movie or download or share it with friends also the user could play movie from internet without download it.

           These are the rest of the scenarios:

           The main page contains all the necessary features that the user needs to perform the required functions. These features are;

1) ADD – This feature allows the user to add his choice of movie to the existing list. Upon adding, the details of the new video should be filled by the user. This user will specify the video’s genre.

2) Move – This feature allows the user the choice of positioning their movies in the desired place on the list.

3) Delete – This feature gives the user the right to remove a movie at their will.

4) Revise details – This feature provides the user with the option of altering the details of the movie at their own desires.

5) Play – This feature allows the user to play their choice of video that are compatible with media players.

6) Share – This feature gives the user the luxury of sharing their choice of video with their friends. It is done through email, facebook, twitter or any other media sharing application.

7) Search – This feature provides the user with the ability to search for their choice of video folder. This is done through the use of three basic stages, which are; file, genre, and type of video.

8) Exit device – This feature provides the user with the option to exit upon completion of his activity.

The main page reflects like this in the screen and shows all the above features that enable the user to manage their choice of video.

Figure: Main page

           Categorizing videos in their respective genres makes it easy for the user to find their specific movies with ease. This categorizing can be done in three ways i.e. by genre, by type, and by title. By so doing, the user is able to find their choice of video without having much to struggle.

          The addition page below gives the user the option of adding new videos. This page provides the user with the destination folder that is made applicable with the user’s computer. In addition, a video link that is thumb-nailed provides the user with the option of getting the video from other sources via the link. A save button is provided for the user to save his video should he want to.

          In order to add a video, the user has to provide details with respect to the videos genre, type, and title and once done, he must click save in order to save the fed details.

Figure: The addition page

Should there be a need by the user to change some of the details concerning the video selected; the prototype allows the user to do so through the revise feature. The changes made respect to the genre, type, and title of the selected video.

Figure: Revise Details Page

In the case where the user feels the need to share with his friends their choice of video, the share page provides the pathway through which the user is able to do this. Several website applications such as email, facebook, YouTube, and twitter enable the user to do this with ease.

Figure: Share page


Testing the system was done with respect to the personas that were mentioned earlier in this project.

Persona 1: Scenario 1

Peterson is a Male Student. He is 21 years old. He studies at the University of Kota. He is a fourth year student taking a degree in Economics and Business Studies with Information Technology. Peterson undertakes a full-time study program at the university. He is a freelancer in his free time; he opens his email on his computer and gets to the link and adds some comedies.

Persona 2: Scenario 2

Steve is a male student. He is 24 years currently taking a degree in Human Resource Management. He is studying at University of Toronto. He is a third year student and a full-time student. He has many computer skills. He took a diploma in computer before joining university. In his free time, Steve categorizes the comedies folders depending with the size, name, time, and content.

Persona 3: Scenario 3

Susan is a female student. She is 22 years old. She is taking a degree in Business Administration. She is a third year student studying at the University of British Columbia in Canada. She has many skills in computers. She takes her study as a part-time student. She works as the secretary for a bank near her school. On a Sunday afternoon, Susan edits her computer to comedies.

Test 3(Persona 3: Scenario 3)

Task : To add video from a link to the system

Step 1: On the main page, the tester clicks the add button

Step 2: On the video page, the tester types the link C:videospetersontwoandahalfmen.mp4

Genre: Comedy

Type: Video

Title:  Two and a Half Men

Step 3 Once satisfied, the tester clicks the save button in order to store the video.

Test 2 (Persona 2: Scenario 2)

Task: Editing details on personal video files.

Step 1: The tester clicks on the man page and right into the search button.

Step 2: The tester is taken directly into the search page

Step 3: Tester types in ‘Steve’

Step 4: The results are highlighted on the main page

Step 5: the tester then clicks the edit button and is directed to the page

Step 6: The tester adds Genre – home videos, Type – personal, Title – Steve Age 24. Upon clicking the save button, the details are saved.

Note: While the go back page was not included in the original system, the tester pointed at it to try and use it. This prompted the programmer to add it in the edit page.

         On the electronic prototype, the main page is the page tree which virtually shows the contents of the prototype. These contents are home, home page, sports, dishes, fashion, and news pages that are found in the prototype. Upon clicking home, the user opens up the home page that shows the user interface together with the widget table. The links on the interaction interface, footnote name interactions provides DB_Header on case 1. Upon clicking the DB_Header, the user is provided with the option of opening the above named contents in several new tabs for example, OnClick: Case 1: Open dishes in New Window/Tab. In addition, the user is given the choice of setting panel to state by setting DB_Header to state to state 1 slide left in where s/he gets a chance to open social media links that navigates the user to various websites that allows for access to social media sites. For example, on clicking to, the user is directed to twitter and can login from there to interact with others. Once opened in a new tab, the DB_Header provides states 1, 2, 3, and 4 with their user interfaces.

         The next page is the sports page where upon clicking on it, user interface that provides the menu object associated with sports, furthermore, the widget table. The interactions on the right side provides links to various sites that links the user to sports information, an example of this link is that is opened in a separate link.

         The dishes page provides the user interface and the widget table on clicking the page. The interactions provide links that give dishes related information to the user. An example of this link is that is opened in a separate tab.

         The fashion page provides the user interface and the widget table on clicking the page. The interactions provide links that give fashion related information to the user. An example of this link is that is opened in a separate tab. The same applies to the news page.

Step Two

Test your software prototype

         The aim of this testing procedure was to get the two testers to evaluate my prototype. The first tester was 27 years old. I conducted structured questions and this was done with open questions to the tester, which allowed them to speak freely with their opinions about my prototype. I made sure I kept an open mind during the questioning. This tester found the download page very good and easy to use. The other aspect of my prototype that the tester found good was the main page. This is because it was very clear and easy to use and the design layout suited the prototype. However the tester found it odd that there was no log in/log out page, and no revising page. He found that the prototype would really benefit from having these added function features.

         Other ways of getting the tester to give feedback was done by getting tester one to test out the scenarios. The first scenario was getting the tester to click in to the download function. As the tester was clicking in to this function he found that it was interesting and new to have certain features to this function. He found that being able to save favorite sites that the user always goes on to as having preferred links 1, 2 and 3, was a very good aspect. He also liked the fact that you could add links from any other sites in to the download tool slab and click download.

         Tester one then did the scenario two which involved him clicking on the add button for songs. He found this to be a good feature as he liked how there were different categories of description. He liked how as a user when adding a new song you are able to give details about how long the song is, you are able to give a rating, you are able to give a name and how you can make your own identification for the song. He then clicked in to adding a movie. He found adding a movie had a very similar structure in comparison to adding a song and this was a good feature. He found this to be easy to use just like adding a song as you can give all the information you need.

         The next scenario that tester one did was using the home page before clicking in to adding music or video folders. Tester one found the home page very easy to use and found the function buttons of adding a music folder or movie folder very straight forward.

         The second tester was aged 24 years. He went through the prototype and reviewed what he liked and what he found could be improved. He liked the main page because it is reasonable and easy to use. He also liked the box list of the users watch list. He found this as an interesting feature. He also like the URL uploads box on the bottom of the page. However he found I could improve on my prototype by extending the limit on the watch list from 100 maximum to a larger scale for example 200.

         The second tester was very good with his feedback and I also made him go through the scenarios as well as going through my prototype. The first scenario I made him go through was the scenario involving the download button. Tester two found that the download button was straight forward and easy to use. He really liked the feature of adding your own personal favorite sites with the links above the download slab and liked how it was really easy to download a chosen URL from whatever site it came from.

         I then asked tester two if he could go through another scenario which involved him looking at my main page and trying to find the function buttons for adding a music folder or video folder. Tester two found it very easy to read, found the layout very clear and liked how the buttons to add a music folder and video folder were clearly put towards the bottom of the page. He was unable to give any feedback on improvements when it involved the homepage layout and music/video folder upload buttons.

         After tester two went through this scenario I then asked if he was able to go actually click in to adding a music folder. He found this straight forward and liked how you are able to add detailed descriptions about what type of folder it may be and what type of artist it is with your own id name. Once he looked through my adding music folders whilst on my prototype I asked him if he could look at the easiness of using the movie add function. Once he clicked in to adding a movie he then was presented with a pop up that was very similar to the previous and commented that he “liked the ease of description” he really liked how you are able to give the length of the movie folder and add what category the movie is etc.

         Once both tester one and tester two were finished answering my questions I was able to take in their feedback on the improvements that need to be made and what doesn’t need any improvements. If I look at this constructive feedback and compare them I will next time be able to create a prototype that all testers will love and find no faults in.  I will be able to make good functions to suit all types of users.

These are the questions:

1. Can you use the main page?

2. How did you find the saving and add page?

3. Is there any thing entrusting or something you suggest?

This is first note:

This is the second note

Step Three

· I found the visual studio is quite difficult especially when   code some function, however there are lot of tutorial in web side you can fallow. Because I did two paper of Visual Studio so that’s help me a lot of.

· I was able to add what was done on my paper prototype to my software prototype easily as the structure was simple and straight forward. With my paper prototype I found parts were difficult, however with the help of tutorials I was able to add most of what was in my paper prototype. I found adding the functions of ‘adding movies and music’ was nearly exactly the same as my paper prototype.

· The paper prototype had an editing function that was created. Unfortunately I was unable to add this editing function to my software prototype. I did not add this function because I found it was too challenging and I thought the need of this function wasn’t high.

· I found that creating the interface was the easiest part when involving the technical issues with this software prototype. I also found that designing the buttons and decorating them was very easy but actually functioning them was the hard technical issue.

· I believe it would be relatively easy to modify my prototype depending on the scale of modification. If I were to add a simple function to modify my prototype that would be easily done, however if I was to restructure the whole prototype I would find it very difficult and challenging.

· With comparing the paper prototype to the software prototype with users, ultimately it is easier to test the software prototype with users. When trying to explain how parts will function to a user from just a paper prototype a lot of confusion can happen and this can cause the user to find your prototype hard to use. However when testing the software prototype with users they are able to click in to all the functions you have made from the paper prototype. They are able to see what you are explaining and they can in the end test how effective it really is. So in comparison the software prototype is easier to test with a user.

· Paper prototyping is far easier to complete. Paper prototyping you are able to create things that may not be realistic when trying to put them in to actual software. It may take a couple hours to create what type of software you may want in your design. When creating a software prototype it is very time consuming as you have to create everything and you have to create it so you and users are able to use the software easily. It can take days to complete in comparison to paper prototype only taking an hour.

· Environment of having others around you can make creating the software very difficult as you can get of topic and go on to other things.

Step Four

I think for refinement to this prototype I will:

1. Registration

I would add this function to the software to make it more private and to also allow users to see who you are under your own identification. In doing this it will allow the user to share information with other users if they wish.

2. Login

Having a log in function makes it easier for a person to access their information from anywhere. An example of this is going to a friend’s house and using their laptop, you are able to access all your saved information on their laptop by having your own log in. if you were to not have a log in it would make your page less private and make it harder to access whilst around different locations e.g. around different places in Hamilton like the library, computer lab, at home.

3. Forget password

If there is a log in for a user there will need to be a system in place to get in to your account if you ever lost your password. An example of doing this is having a number saved with your profile that would allow a txt with new password to be sent to that number. Another way of recovering your password can be done through questions that are saved e.g. fathers first school and having the answer the key to recovering the password.

4. Revise for both movies and song

I would create an editing option for movies and songs. This will allow users to revise song names, revise any special details or add any special details that were missed out.

5. Logout

Having a log out system in place ensures that each user will have privacy to all their saved data and will only allow them access to their id.

6. Mobile

Having this system on a mobile would be a great idea. Every person seems to have a smart phone these days and if this software was available on a mobile the user ratings would increase substantially and the popularity of the software would increase rapidly.

7. Rating system

Having a rating system with users is a great way to get other users to watch the good and bad. If users found that the ratings were not great they would most likely not watch anything. It also is less time consuming as it eliminates the need to watch pointless music or video folders.

8. Feedback system

I would like to have a feedback system. This will allow other users to leave comments about the music or video folders that are on different user pages. It is also a way to know what other users think about the videos and music videos certain users have.