Alex Ivaylov web developer blog.
 

 

My New Flash Game

Posted on June 13th, 2010 in category Uncategorized

As you know, I am not a big fan of flash, but I had it as an assessment for my Interactive Product Development unit. The task was to create a keepy uppy game. For those of you who are not familiar with Flash, basically you can put different object in there (for example the ball), which will not do anything, unless you program them to. The programing language in Flash is called Actionscript. When you click on the ball it will not do anything unless it’s programmed to.

In my case, I had to program flash to calculate, where the ball has been clicked and then move the ball depending on the point where the ball was clicked. We are using trigonometry (yes, the things with cosines, sines, tangents..) to calculate where the ball has to fly, how hi does it have to fly and how heavy should it feel (when should it start falling down).


The future of web apps

Posted on April 9th, 2010 in category Uncategorized

One of the main purposes of the next generation of web technologies such as HTML5 is to get all those multimedia and interactive elements, which today can be achieved only by using plugins and make them part of the standard HTML DOM (also accessible by the JavaScript/CSS/etc).

For example, to embed a video today, most of the web sites use Flash, which requires a plugin and the embeded flash movie is not controllable. In HTML5, a video is inserted, similar to the way images are inserted in the previous versions: today, we insert an image, using something like <img src=”file.jpg”>, video will be inserted in HTML5, using the markup similar to <video src=”video.ogg”>.
Read more »


a separate project – DJ.Alex.BG

Posted on March 29th, 2010 in category Projects

I have started a separate website where I will write about music only. The address is: DJ.Alex.BG


Please note

Posted on March 15th, 2010 in category Uncategorized

Please note that this website will be totally redesigned and WordPress won’t be used for it anymore. I am doing a new graphical design, which will be more into the current trends.

I am also writing my own Content Managment System specially for what I need. The CMS will basically be a collection of all the best elements I have seen and liked around thousands of websites on the web. It will be based on the LAMP technologies (of course). And for markup, I’ll use HTML5 (only some elements, which are currently supported by most browsers (or planned to be supported)). Once, the CMS is ready, I will make it available open source under the GNU/GPL license.

Unfortunately, I am so busy that I don’t have any time to work on it, so I can’t really tell you when it’s gonna be ready…


About usability

Posted on February 9th, 2010 in category Usability

Usability is a term used to denote the ease with which people can employ a particular tool to achieve their goals. In User Interface design, usability is the clarity with which the interaction with a computer product is designed.

Main points of usability are:

  • Ease of learning
  • Efficiency of use
  • Memorability
  • Error frequency and severity
  • Subjective satisfaction

In this category, I will be writing about usability, relayed to my cinema kiosk interface prototype:

Click here to open the Kiosk prototype


Heuristics: 1. Visibility of system status

Posted on February 9th, 2010 in category Usability

It is important that every software product keeps the user updated on what the system is going on every moment. It must be clear whatever the system is doing something or it is waiting for the user to make a choise.

All these has been taken into consideration, when designing the Atro kiosk interface and the user has been given clear instructions if they have to click or something or if they have to wait for this system to do something.


Heuristics: 2. Match between system and the real world

Posted on February 9th, 2010 in category Usability

The logic and the way the people see the Atro cinema kiosk system’s interface is pretty much the same way as if they are purchasing tickets from a salesman:
a. Indicate their interest by clicking on the screen (same is if they start a conversation with the sales man)
b. They see a list of movies (same as if they were told the current movies by a person) OR (they collect reserved tickets (same as if they asked a real person for them)
c. They choose ticket options (projection and quantity) the same way as if a real person asked them for the projection and the quantity.
d. They pay by cash or card in the same way as if they were paying to a real person.

The main purpose of the kiosk is to replace the sales person.


Heuristics: 3. User control and freedom

Posted on February 9th, 2010 in category Usability

Users should be able to go back if they choose the wrong option or if they make a mistake in their choises when using the system.

At the moment, this is only partly implemented, while the user is viewing the movies on show.

This has not been completely implemented into the prototype, but will be in the final product.


Heuristics: 4. Consistency and standards

Posted on February 9th, 2010 in category Usability
  1. The system is standard. It is similar to all other cinema kiosks.
  2. It is similar to other systems, which the user has probably already used.
  3. The system is nearly the same as the self checkout machines in the big supermarkets, which more that 80% of the people have used.
  4. The system is similar to a cash machine, which more than 95% of the people have used.
  5. The system is consistent. The element positions, colours, texts, controls, etc. do not randomly change as the screen changes.
  6. Once, the user starts using the system, the elements are at the place, where he would expect them on the next screen.

Heuristics: 5.Error prevention

Posted on February 9th, 2010 in category Usability

Making your User Interface inform your users about their errors or mistakes is one of the hardest tasks.

When creating the error reporting features, these should be taken into consideration:

The user must understand what the problem is.

The user must understand what have they done wrong.

The reason for the error and its details must be clear for the user.

Error messages, such as “Error 0x043502340” should not be displayed at any point to the user.

The user must not get fustrated by getting errors from your system.

Highghly emphasized error messages, with high contrasted, shining, blinking, red typefaces should be avoited.

Experts recommend that similarity with the real world is taken into consideration when designing the error reporting interface.

For example: Imagine that you have a paper form, where someone has forgotten to fill in a required information: What you will do is go to them and kindly ask “Hey, can you have a look at this…”. Most of user interfaces out there display highly emphasized error messages with a lot of blinking red text which has explanation marks. This always causes fustration in the user because it makes them feel as if they have done something very bad which can not be fixed.

In this prototype: These points have not been implemented, because the prototype does not return any errors. Once, the


Heuristics: 7.Recognition rather than recall

Posted on February 9th, 2010 in category Usability

The user should not have to remeber a lot in order to complete their job. The systme should provide all the information, which the user needs in order to complete their task. \

For example: Giving the user a five digit ID number, which he must remember to complete the transaction in the end.

This has been taken into consideration when designing the kiosk interface and all the information that the user need is shown then they need it.


Heuristics: 8.Flexibility and efficiency of use

Posted on February 9th, 2010 in category Usability

The system should be easy for the user to learn it so that, when they came back later, they could do their job faster. This means that all the other heiristics points must be taken into consideration and that the system UI must not have any major changes, unless they are extremely necessery.

If changes are needed, they must be done in a way, that should keep the UI as close to the old one, which the users have already learned, as possible.

Techniques for promoting other less used parts of the system, by replacing them with the most used ones should be avoided. An example is Facebook, which recently implemented a new User Interface, which intents to make their users use the chat function more, by taking away some of the most used modules and replacing them with chat options. This is currently causing problems to a lot of Facebook users and most of them are not happy with the change.

In the kiosk prototype, due to the consistent UI design, it is easy to learn and all these layout will be kept in the future of the design.


Heuristics: 9. Aesthetic and minimalist design

Posted on February 9th, 2010 in category Usability

Elements and information which are not needed in the current screen of a UI should be avoided. They could only get the user confused.

This has been taken into consideration for the cinema kiosk design, where we have an aestetic and minimalist, user-centered design.


Heuristics: 10. Help and documentation

Posted on February 9th, 2010 in category Usability

Not only in computing but for every product, it is essential that there are instructions on how it can be used. This is the reason why every product comes with the a manual.

Help must be available for the user, for every task and subtask, they are trying to do. We can never assume, that the end user knows how to use the system.

In our prototype we have not implemented any help and documentation, yet but we are planning to add a phisical button on the kiosk machine, which will say “Help” and will open detailed help information on how to complete the current task. We will also let the user call a trained real person to assist with the kiosk usage, if needed.


Intuitive interface

Posted on February 9th, 2010 in category Usability
  1. The user knows where they should go next on every screen
  2. The UI controls are outlined and clear and the user knows which one is the button for what
  3. The user knows where they are within the application
  4. The user knows what they need to choose from the available products and options
  5. The user knows what the system is doing at the moment
  6. The user knows what they need to do – the system gives clear instructions and provides all the information which the user needs.
  7. The system is consistent.
  8. The system is standardised – all other cinema kiosks are made the same way.
  9. No pointless and additional work for the user. The system will not ask the user to perform an action, unless user’s interaction is required and cannot be done automatically.
  10. No unneeded information. The system does not display information, which is not needed by the user at the current moment.

« Newer PostsOlder Posts »