Stephen Waller
Stephen Waller

Cisco - Learning Environment


Client: Cisco
Agency: The Team
Role: Co-Concept, Design, Illustration, Animation, Art Direction

The CLE (Cisco Learning Environment) was a large and extremely powerful web application that allowed students of any age to learn and collaborate online with their fellow classmates, students, teachers and lecturers. Utilising Cisco techologies such as WebEx, Show & Share and Jabber, users partook in live online classes, and then collaborated with others on assignments in real time. Whether that be essays, blogs, wikis or even videos.

Co-concepted and designed with Sam Smith, CLE was initially intended as a 3 week reskin, but quickly escalated into a radical redesign that stands apart from all the other products in the same marketplace. In the process, it took me from London to Birmingham to Edinburgh and all the way out to Bangalore.



Initial Design

A prototype design to show how the system could break away from the confined structure of a more traditional website. The one constant throughout the project, the notion that the user, as characterised by the customisable avatar is always at the heart of the system.


Concept animation



Home page

A more formalised design that allows for more flexibility for the varied types of content required. This page shows all the latest information the student needs to know upon entering the system.



As well as a filterable notification area, advising the student of all curricular and non-curricular activities, there is a system-wide notification panel that can be accessed from the user's avatar on the left hand side.


Flyout navigation

Providing swift access to any part of the site within one navigation structure.


Assignment Details

As well as collaborating online, students can also pick up, complete and submit whole assignments online. Once completed, they can then be marked by the teacher online, generating grades and automating progress reports.


Instant Messaging

Also included in the system was a complete instant messaging package, powered by Cisco's own Jabber technology. This came in two forms: A small persistent messaging window accessed via the avatar, which could then open out to a more comprehensive chat facility with group functionality.



Keeping management of contacts similarly came in two forms. A more standard list-based contact view, and an avatar based view, to make the experience of contact management more visually appealing and fun.


Avatar Builder

At the very heart of the system is the fully functional avatar builder. With millions of possible combinations, it allows everything from head shapes to hair styles, eyes, noses, ears, facial hair, glasses and clothes to have customisable options.


Demonstration animation