Archive for January, 2008

Project Report

Due to the nature of this project I feel that I am unable make my website live due to the video content and copyright restrictions placed upon these files. I have gained these video clips for the project in an unorthodox manner, as I do not have access to royalty-free video footage, which seemed to be the only option available to me. 

The finished prototype was not as I intended and because of this, I feel it could have been greatly improved. My intention was to create an embedded video player to my specifications that would coordinate seamlessly with the website design and not simply use a standard media player. I had intended to use SMIL formatting to achieve this, yet after much testing, trials and advice from my tutor I was unable to get the code to work in the preview mode of Dreamweaver.

User Testing and Accessibility

Once I had completed the website, I carried out a usability survey of eight people to discover how others found using the site. The majority of people liked the concept of the site, especially as half of the people asked live in a non-cable area and are only able to get Video on Demand (VoD) services online. Two people were uncertain of the design and found it “a bit bleak”, yet all liked the simplistic style. To rectify this, the design could easily be altered to have an all white background with brightly coloured links and navigation bars, providing a lighter and fun style.

QuickTime media player proved a popular choice with the test users, who all had the QuickTime application on their computers. However, it may have been better to use Flash media player, which is a universal application without operating system conflictions, but I personally prefer QuickTime.

Instead of forcing people into downloading a download manager onto their computers I would have liked to use something similar to the system that webassist.com uses. This is an integrated download manager on their website that can only be accessed through creating an account and receiving an email to the designated email account which redirects the user to the download manager page. This would be a simplistic method that could reduce piracy. Yet it would not group together files once the download process had completed and could create an unorganised download folder.

I was unable to test the website fully as I have only produced a prototype of the main areas of the website and was also unable to fully design some areas, such as the checkout and the community forum. However, these are common aspects found in many websites, six of the users were already familiar with the eBay/PayPal checkout service, and four had previously used forums.

Developing Employable Skills

Before starting this project, I had a very basic knowledge of using CSS in Dreamweaver and a bare minimum of embedding video content, partly due to new media not being my specialism. I have greatly developed my skills at using CSS by using tutorials and how-to guides to gain a better comprehension of how the process works. This includes using CSS to alter bullet points, a fluid layout, adeptly changing fonts and colours and learning the correct terminology. Something I am glad to have discovered is how to make a fully CSS navigational bar that has the look more professional look of tabs, as I have never been taught how to use Flash to produce an animated navigation bar. However, there are free flash navigation bar generators online that I could utilise to surmount this problem.

I have attempted to learn SMIL, something I had not heard of before this module, but I was not wholly successful. It appears to be an underdeveloped area of web design as there was little help or tutorials to be found online. If I were able to speak to an expert in SMIL to understand how to overcome the problems I encountered, I feel I would be able to competently use SMIL in the future.

Further Development Ideas

With time and money invested into this project I feel TV Heaven could become a valid website. As this assignment was to create a prototype, I saw little need in completing a full A-Z database of TV shows available to watch, as well as each programmes details. This would be a large undertaking and would most likely require a team of developers and researchers to complete the content.

It would also require negotiations with various production companies to gain copyright access to the programmes. This may prove costly and some production companies may not wish to be involved in the project resulting in an incomplete database of television programmes.

By hiring web professionals’ areas like the forum, creating a user account and a checkout system could be added. I was unable to do this, as through researching forums, it seemed knowledge of PHP was needed and checkouts required creating user accounts with bank details, which I felt disinclined to do for this assignment. In addition, greater anti-piracy methods could be developed to maintain a good relationship between the website and the television production companies. 

Advertisements

Prototype

Project Outline
I created an interactive game in flash. The game has a turret point which shoots in the direction of the mouse. The turret point shoots to the enemies which go right to left. To get to the next level users has to shoot a sufficient number of the opponents.
Users get points for shooting down the enemy and each kill is worth 10 points.
Users starts the game on the first level as a labour worker. If they score 100 points they will get to the second level and they will get promotion for a team leader. And as follows:
100 points- Level 2- team leader
200 points- Level 3- supervisor
300 points- Level 4- manager
400 points- Level 5- director

Skills

I demonstrated a number of skills that makes me employable.
A reset function- set up the start location and speed for the enemies
Variables to duplicate the enemies
Collision detection-
detects when a shot hits an enemy and consequently makes it explode and disappear.
detects when an enemy collides with the gun, at which point the game ends.
Hit test- (for scoring points and game over)
Resetting enemies after exploding
limited number of shots-I used a code which limits the game to having a maximum of 4 shots on the stage.
Scores (variables)- users scores points and get to the next levels
Game Over function
A restart button
Sound- possibility to mute the sound.
Animation
Buttons
I have developed my designing and planning skills. Furthermore, I have deepened my knowledge about the interactive design technologies. Also I increased my understanding of interactive design principles and creative thinking around interactivity and design. I learned to think creatively about online presentation and distribution of media on CD. More importantly I deepened my knowledge through independent study of the Flash technology.
My project delivers to users more than one form of media at once. It include text, sound and images. I created a medium which is interactive to give a user control and to achieve two-way communication

Problems and future ideas for development
The game has an error. I think there is a problem with a collision detection. The shot hits an enemy and makes it disappear. Users cannot see the enemy but I think it stays on the stage as an invisible object. When it (the invisible object) collides with the gun the game ends. Originally I was planning to draw a line which would stop the enemies to leave the stage. Hitting the line by the enemies would mean the end of game. Users would have to shoot all the enemies which appear on the stage. – this would make the game slightly more difficult and challenging. Furthermore, I was planning to create more levels where users would have to score more points. All of that can be developed when the error is resolved. In order to make the game working I placed the gun at the bottom of the stage where the enemies have less chance to hit it. It does not make the game challenging or exciting but at least it works for now and presents what I am trying to achieve.

Usability test

When I finished the product I did a usability test among 20 people. All of them liked the project. None of them had any problem with understanding how the game works. Ten out of twenty people managed to get to the fifth level when they played the game for the first time. Five people were stopped because of the error. I created also a Polish version of the game which allowed the Poles to understand the instruction written in their mother tongue language.

Conclusion
I intend to place the finish product on my on my final project website which will aim at European Union citizens who come to England to start a new life. It will also may be placed on the Independent Polish web portal http://www.bham.pl which provides visitors with information, forums, articles and chat rooms. The online community was established for and by Polish people who along with other immigrants for economic reasons arrived in Birmingham to start a new life. Those people often are very well qualified, but have only basic communication skills in English. Therefore they are unable to undertake tasks according to their qualifications which may lead them to a frustration. My game may give them the chance to take their frustration out, give a little bit of fun, make them laugh and possibly give the chance to virtually take their anger out on their bosses.

Resources
The tutorial sites which I used http://www.tutorialized.com/tutorials/Flash/Games/1

Kurt (01.06.2004) Building Games in Flash 5 – Enemies and collisions- tutorial http://www.tutorialized.com/tutorial/Building-Games-in-Flash-5-Part-3-Enemies-and-collisions/2402

KirupaBlog Hit Test (Collision Detection)- http://www.kirupa.com/developer/actionscript/hittest.htm

Luke Knepper Handling Score in a Basic Game – http://www.flashkit.com/tutorials/Games/Handling-Luke_Kne-1399/index.php

Flash Space Shooter – Enemies Tutorial http://www.tutorialized.com/view/tutorial/Space-Shooter-Enemies/29427

Polonia Birmingham Polski niezależny Portal w Birmingham (translation: Independent Polish web portal) http://www.bham.pl [viewed 22/10/2007]

Project Report – Azeem Ahmad

My project will be live and online from tomorrow (11/01) at http://www.fleetbuzz.com (it will be at the bottom) – I chose this website as I did my work experience there, and I am on personal terms with the admins there, so they kindly agreed to host my project for me at short notice.

My final project is not what I originally intended as I had planned to host it myself on my own website, but other circumstances have led to having me change my project and its location in order to meet the deadline on time. I have still managed to amalgamate the four websites RSS codes into one through manipulation of them, one by one. The unique source code that I made is still available however, and will be part of this project.

User Testing, and Accessibility

I managed to get the product tested by the administrator of the website, who found the concept good, and said that it was easy to use. He did say however, that once he was re-directed to the ‘holding’ website, HitRSS, that it became a bit difficult to use. I overcame this by making the link to the news websites more prominent on the RSS Blog, therefore making it easier for the user(s) to access the news they were originally after.

Ideally, as mentioned earlier,I would have liked for the product to be hosted on my own website. I do feel however, that it is easy to access on the FleetBuzz website, as it is placed with all of the other external links. If I had more time to do this project, or to do it again, I would invest more time in advertising and promotion of my product, in an attempt to compete with its bigger competitors.

Skills and Development

When I started this project, I had a very basic knowledge of RSS. I knew what RSS did, but I never understood how it worked. During the course of this project I now feel that I have an excellent knowledge of RSS and its capabilities, and how RSS itself works. I am now able to de-construct an RSS reader, explain what part of the reader has what function. I also understand RSS as a language, and I have demonstrated during this project that I have achieved skills which will make me more employable in the new media industry, but also as an online journalist too. I have skills which enable me to become an online journalist, or to work in the new media industry.

Ideas for development

This project could easily be developed into something much more bigger given more time. It could easily be developed into a website of its own, even created using Flash or JavaScript language, making it more contemporary.

It could also offer users the chance to subscribe to the site, and offer their own websites and links for RSS amalgamation.

The site could also become ‘wiki’ style, giving users the chance to log on and edit parts of the website themselves, making each user a personalised home page. Each of these technologies embrace the web 2.o ethos, and have scope for potential future development.

Bibliography – Web Resources

I used the following websites to aid me with my project’s creation:

gotoAndPlay () [Available at: http://www.gotoandplay.it/] [Viewed on: 10/01/08]

Kirupa [Avialable at: http://www.kirupa.com/] [Viewed on: 10/01/08]

Web Thang [Available at: http://www.webthang.co.uk/tuts/tuts_fmx/scott4/scott4b.asp] [Viewed on: 10/01/08] 

Further Ideas for development

The skills that I have developed and practiced throughout this module have been beneficial to me in that I now have them to use in future projects, and I genuinely feel confident with them. 

Firstly my initial idea for personal development will be to continue with trying to resolve the problem surrounding the use of PHP in my project. 

Secondly, for the purpose of this assignment it was not necessary to build all pages to the website; however these are what I will now look to build and develop, so that the menu links such as ‘About me,’ actually have some content to link to and display.  

In terms of developing my CSS skills further, this could include making print-friendly versions of my web pages to go with my portfolio site as a brief example, but overall I think the more practice I have with CSS the better my chances are of becoming quicker at designing on the whole. As for PHP there is a large amount to develop with, and my original project idea of a Facebook application will be another main focus of mine. PHP is where the future of web design is, and as a growing web designer this is the direction I too need to be taking.                  

New Employable Skills

CSS is seen as a fundamental part of web design; however is an area that I personally admit to have been quite lazy with since learning the field. This is the main reason why I now wanted to develop my knowledge within the area, because at such an important point in my academic studies I knew that it was vital to know how to deploy these key skills confidently into practice, given that my third year project is to build a website and that will take such elements into account. What’s more, they are basic knowledge and skills that are almost certainly required when seeking employment within this sector, Employers will not only be looking for someone who can create unique designs, but will also depend on that person to have such skills that will make the work they produce more accessible, as this is an important issue for web companies. CSS skills also engage the designer more so with usability, for instance the placement of content is thought out more logically with CSS, and hence makes the designer more aware of how content appears and impacts on a user’s general site experience. The main reason people want websites is to attract the attention of users, and a user’s attention is only held with good design – something which CSS clearly promotes. 

Not only have I tried to improve my CSS knowledge and skills, but I have also used some PHP coding in my project. PHP itself is a technology which I have only recently been introduced to, and was the basis for my original project proposal which unfortunately became overrun with problems, and these were deemed too challenging for the short space of time with which this project had to be completed within. The use of PHP in my project is to pass PHP variables with a URL. This means that with my CSS designs, a user would be able to change the style/design of the webpage dynamically, i.e. change/load the new style into the webpage itself by clicking on a link.

In order to learn and develop this technique I first worked with a tutorial, and later also sought advice from the module lecturer. Unfortunately however, I have not yet been able to get this feature to work 100% correctly, and have been trying several methods, that I have been testing on my own personal webspace (http://www.katiebutler.co.uk) over the past week to resolve the apparent problem – so far with little success. Despite this my understanding of the technique has developed from virtually nothing to an adequate level, therefore with more practice and guidance I may eventually be able to get this element to work how it should. In doing so, I will have gained further skills to present to and hopefully impress potential employers or even clients with, especially those who may want to utilise my web services in the future.

CSS and issues of Accessibility

CSS essentially encourages web designers to create more accessible web pages and hence more accessible websites overall – due to the nature of their functioning. CSS as I have outlined in some of my previous blog research, gives designers more control over their HTML pages, for instance they become more flexible, and elements of design can be changed relatively easily to suit a user’s requirements.    Having done some Internet research into accessibility beforehand, I can now identify how my web pages and CSS designs have been made accessible. 

  1. Each page conforms to general usability guidelines, i.e. such as making links distinctive through colour, underlining etc
  2. Each page is cross-browser compatible, and so looks almost identical in IE and Mozilla Firefox etc (http://www.browsershots.org/)
  3. Each page has been optimised to a certain extent (meta tags) so that search engines would be able to prioritise the site more easily.
  4. CSS has allowed me to control content via ‘DIVS’ which effectively separate content, yet still present it in user-friendly ways.
  5. The use of CSS also means that an alternative font will be displayed with regards to all text, if the current one is not installed on a user’s computer.

 In my designs I have also used a wide colour range, and it is always useful to check these colours with VisCheck.com to guarantee that people who are visually impaired (i.e colour blind) can still see some form of colour at least, ensuring then that they are not missing out on any important information as a result of this, for example the page’s links. This is a quick task that I have used before in previous projects and is another valid way to enhance accessibility. (See Appendix 1 for results of this testing)

Further ideas for development

There would be more levels; each dropping down different categories of healthy food in order to educate the child into what is needed for a healthy balanced diet. I only completed the first level a day before it was due, therefore I did not have enough time to create more. Levels would be harder than the previous one as foods would drop at quicker speeds and the score needed would increase to move up a level.  

Lives and a health bar could be added to the levels. Every time the lunchbox was to catch an unhealthy food, the health bar would decrease, when this has disappeared they would loose a life and the level would start again. To further this, a countdown could be added to complete this game in a specific time. If all the lives were lost or the countdown was to run out, it would take them to a game over screen. These aspects would make the game more fun and challenging for the child. 

If there were more levels, I would make the well done screen at the end of the game more educational by showing them what healthy foods they collected; it would also inform them what is needed in a packed lunch for a healthy balanced diet.  

Interactivity could be furthered by adding sound and including a volume controller. As well as this, a high score board could be added for the competitive side of this game.

The prototype as it stands has both the play again and exit buttons going to frame 2. If I was to have a game over screen this is where the exit button would take the user. As well as this, the game is simple with one level so no real need for a play and pause button, if more levels were added these would be needed.  

Experiences and skills that make me employable

I set myself a challenge which I knew would test my abilities in Flash in order to make me more employable. The game I produced has done just this as I have improved on previous skills and also gained more, I have also enhanced on my creativity skills.  

I have taken a lot of consideration into the design of this game to make it look professional and appealing to children. I produced all of my images in Photoshop and then imported them into Flash, some are royalty free clip art images from the internet and some designed from scratch. I have added specific designs which show my flair and that my creativeness has improved such as lunchboxes, a border, rainbow and an interesting style in text. See the link below for an example of the design: 

http://i228.photobucket.com/albums/ee91/kylie_g27/mainscreencopy.jpg  

I have achieved to improve on the main technical objectives I proposed to do. In this game I have successfully been able to understand how to assign random x and y co-ordinates to movie clips, to further this I have understood how to do this in one function which relates to all the separate movie clips when they are each called upon. A function saves me writing up the same code for each separate movie clip. As well as this I have applied a number of hit tests to the game and a scoring system. The above elements took me a long time to grasp hold of but I feel I have had a great experience through understanding more into ActionScript. I have logged the processes that I went through to complete this game; this is only available in a word format.

I aimed to add many more elements to this game in the time given but as time went on I realised this was not possible. These aims can be seen in this Gantt chart: 

http://i228.photobucket.com/albums/ee91/kylie_g27/GanttChart.jpg  

I then set myself objectives that could be achieved. I have learnt from this mistake that I need to plan correctly, set reasonable aims and manage my time appropriately.

Testing, Usability and Accessiblity

It is now only a few days away from the deadline and I am still overcoming problems in producing my game, therefore I do not yet have a full working prototype. For that reason I have been unable to test this game to the target audience as it would be inappropriate to do so.

If I was to have a full working prototype, I would test the game to 10 children and ask them a series of questions. As I could not do this, I asked these to myself and looked at the game from a child’s perspective as I have been throughout. The questions would be as follows:

·        Did you find it easy to understand what you were meant to do in this game and was it easy play?

The game is informative through its instructions and easy to play as I have made it clear what the child should press on by making rollovers by either enlarging something or changing the colour. I only included key press options to start with but after thinking about this I thought it would be useful for me to add buttons, I did this to provide more options for the child.

·        Were you happy with the selection of lunchboxes you could choose from?

Out of the three lunchboxes I designed, I think at least one would appeal to a child as I created one stereotypically for girls, one for boys and one that I felt could appeal to both.

 ·        Was this game fun to play and did you like the design?

There are elements I would have liked to add if I had the time which I will explain later.

·        Did you understand what this game was trying to educate to you?

I think this is quite clear, however if I had more time I would have improved on this which I will again explain later.

I included aspects to make this game available to those children who have a disability, they are:

·        Keyboard access

·        Adding accessibility tags to the images and movie clips.

·        Designing the game carefully by being colour wise and including the text Maiandra GD which is not difficult to read.

« Previous entries