This weeks e-learning challenge was to demonstrate how text and images can be used in e-learning. Any number of methods could have been used to demonstrate this including text animations, faded backgrounds, titles incorporated into images and also interactive info-graphics. I decided to create a menu structure that included simple text and button animations with a faded background to enhance the text and icons on the screen.
I started my development by selecting a background image, I used a free scenic image available from the Articulate Heroes download section. I then set about creating my menu using rotated squares and button icons to make up the different panels. I applied hover states to all of my menu items (except the title in the middle) and used hotspots for each rotated rectangle to trigger these states. Hotspots had to be used as when the mouse left the button the state did not revert back to normal.
For the text element a title and description were added for each button that would be initially hidden and then revealed when the mouse was hovered over the corresponding hotspot.
Lastly animations and different entry spots on the timeline were added to add some finishing touches.
Overall, I thought this challenge was quite nice and simple to accomplish as I have already been working on similar menu styles.
Unfortunately, there seems to be a fault with the menu hover animations as sometimes the hover state does still not revert back to normal when the mouse leaves the hotpot.
Further research will be needed in order to fix this problem.