e-Learning Valentine

Click on the image to view the demo

The challenge

The Articulate e-Learning Heroes challenge of the week #70 was to design an interactive graphic, demo or activity that features a Valentine’s Day theme.  Suggested interactions included “History of Valentine’s Day”,”Valentine’s Day Around the World”, “Top 10 Things to do on Valentine’s Day” “St Valentine’s: Facts vs Legends”, “Interactive Valentine’s Day Cards” and
Valentine’s Day Recipes”.

The process

I initially sought inspiration for this project by searching for engaging Valentine’s images.

My design was developed in Articulate Storyline 2 and started with the background image with the tree in the shape of a heart.  I still wanted to create an interactive Valentine’s Day card, but wanted to use this background image, so came up with the idea of placing the envelope on this background to start the interactivity.  To maintain consistency, I used part of the background image in the next screen as a “carpet of leaves” to lay the envelope and card on while it’s being opened.

I wasn’t going to put any instructions or indications on the screen apart from the spinning envelope, but right at the end of the development I changed my mind and added the arrows.

I created the envelope from scratch, based on this image that I came across.

I started with basic shapes in PowerPoint, then added a paper texture file to fill the shapes and started working with shadows.  The shadows on the inside of the open envelope are “Inside centre” shadows which gives the envelope the appearance of being open.  I then separated out the different parts so I could insert the card image inside the envelope.

The result

I found the colours in the background image very visually appealing so based my design around these colours.  I also liked the sense of peace and happiness this image conveyed.

Overall I think the interactive elements of finding an envelope, opening it, taking out the card and opening the card, although quite basic in design, are effective  and the design is short, but engaging.

Happy Valentine’s Day!

3d-love-heart-transparent-background

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s