Technical Approach

The initial decision was to focus on developing a native iOS app for the iPad, as this provided the greatest opportunity for effectively communicating the existing Learnmore content.

A major element of the original Learnmore website was a set of audio slideshows in Adobe Presenter format. However, this was a major challenge for the project. Our primary goal for this content was to produce a long-term, sustainable format that provided support for both online and mobile delivery. To this end, we adopted a combination of XML and SMIL to represent for the audio slideshows.

User studies were originally planned to involve payment to participants. However, a combination of factors rendered that approach redundant. Some evaluation required relatively assessing relatively generic interface design issues, that enabled us to draw on a panel of users who regularly participate in usability studies, and this relieved us of the pressure of finding law students specifically for those purposes.

Furthermore, a number of items of contextual information became available to us early in the project from other studies that were being undertaken with law students specifically, and from associated MSc projects that were examining the actual contexts of use of mobile devices. This enabled us to focus, again, on the specific interaction design of the app, and to either eliminate or reduce our time spent on other projects.

Bi-weekly reviews of the design were undertaken with the law library and law school stakeholders, and weekly evaluations were performed on the interaction designs, following the methods of Steve Krug.

The development cycle itself followed an iterative process, driven by these usability evaluations, as planned.

The initial six weeks identified and addressed core technical issues regarding the slideshow content, alongside doing initial interface design sketches using a Balsamiq variant for iPads, and Photoshop to create detailed mockups.

From weeks 7 to 10, two main designs were iterated and adapted while the development of the common codebase was completed. By the end of week 10, an initial slideshow method was complete, two potential information architecture structures were specified in detail and the two interface designs partially implemented. A major review at this point, including all current usability data and input from the stakeholders was undertaken, resulting in the initial selection of both information architecture and interaction design.

However, the issue of the visual appearance of the chosen interface remained a major concern, as there was a tension between fidelity to the existing website on one hand and providing a user experience that was consistent with the iPad on the other. Learnmore’s online style appearance is very driven by informally style pencil drawings, and this was incongruous in the context of the relatively industrial appearance of the iPad interface. As Learnmore’s success is driven by both its informal style regarding both content and appearance, it was important to resolve this apparently superficial issue, or the nature of the collection would be lost.

A weekly development cycle was continued up to week 16, by which time the core function of the system was nearing completion. The issues of content tailoring to the iPad context were also mostly resolved. All text was placed in HTML format, as this was displayed rapidly and could be navigated smoothly, whereas PDF content, while richer, suffered from lagging response times to user selection and navigation, which proved to undermine user satisfaction. The issue of style was almost resolved by this point, by combining an irreverent use of photographic images – matching the style if not form of Learnmore online – with a traditional iOS styling to the interface.

The overall interaction design relies extensively on swiping and scrolling, whenever possible, and minimising the use of buttons. This provides a highly tailored user experience that exploits the touch-based interaction of tablet/slate PCs, and maximises the space available to display the content to the user. A consistent pattern of navigation was achieved by this point for both the slideshow content and written content – sideways swipes navigating the user between either slides or pages.