OSS campaign design

This project was completed in the middle 2015. The purpose of the campaign was to promote open-source related content. We set up each page with a topic about OSS on Azure along with a link to the details. Since the majority of users are Developers and the campaign was only online for a month,  we chose a very bold technical style in order to catch their eyes. Furthermore, Html5 increases interactivity and is very interesting and engaging.

Challenge
  • Though HTML5 has been popular for quite some time, it was the first time for both the Developers and me to work with it.  As such, we needed to have multiple discussions in order to secure a final online version.
  • When using the demo and the parameter table to communicate with the Developers, I had thought we had finished. Until I had seen the beta version, I didn’t realize there would be too many steps requiring the users to have to scroll through for each animation.
  • Before the process went online, there was much feedback regarding the guide system. It turned out that there wasn’t enough guidance for the users to scroll down to the next topic.
Solution
  • We spent some time researching HTML5 cases in the market. We used the animation demo to communicate with the Developers and placed all the detailed animation steps and associated parameters in a table.
  • Whenever users scroll down, a group of UI elements would appear.  We limited the scrolling to no more than three steps for each topic so that the users would not lose patience.  We kept the background static so that users would experience the floating elements.
  • We added guidance hints at the bottom of each screen prior to the system going online.  An arrow moved up and down to draw the user’s attention.
H5-1
H5-2
H5-4
H5-5
H5-6

The demo

Result and reflection
  • We received very positive emails from Developers and Project Managers expressing their appreciation for our work.
  • We successfully involved 20% of unique visitor participation and increased the PV of the related pages.
  • The latter the links, the less the clicks there are. Thought was given on how to encourage users to see and experience more the next time they used the system.