Opensource Matterhorn educational video platform user interface redesign

Post on 01-Nov-2014

82 views 0 download

Tags:

description

This presentation was given at the 2014 Harvard University Opencast Unconference. The topic was the open source Matterhorn educational video platform user interface redesign funded by the ETH University and Entwine. This talk describes the technologies and techniques utilized in the design. It's all the first demonstration of a fully internationalized (i18n) user interface.

Transcript of Opensource Matterhorn educational video platform user interface redesign

matterhorn admin ui

entwine knowledge in motion

requirements

> technology suitable for the community

> modern and proven development stack

as close as possible to 100% test coverage <

> support for i18n and i10n

> code and style documentation

flexibility to integrate local requirements without the need to fork the codebase <

entwine knowledge in motion

what did we aim for

entwine knowledge in motion

choice of technology

> the community uses java, therefore vaadin was a natural choice

> can use existing java service implementation

> write once, run anywhere

> requires a java engineer to customize

> uncertainty about the framework’s future

entwine knowledge in motion

choice of technology

choice fell on angularjs <

> modular development, little to no dom manipulation, emphasis on testing, growing ecosystem

> applies high level concepts to web application development

supported and used by googleand others for a couple of years <

entwine knowledge in motion

development stack

> grunt based javascript setup

> translation through crowd sourcing withvarying degree of “crowd” aspect

easy way to mock endpoints <

entwine knowledge in motion

test coverage

> everything is tested by jasmine, selenium jshint, and the karma runner

as part of the build

> very difficult and not feasible tobuild full end-to-end tests

entwine knowledge in motion

test coverage

> 2’484 lines of code (as of today)

> 2’259 lines of code

83 end-to-end tests, 58 unit tests,

168 assertions<

entwine knowledge in motion

globalization

> internationalizationand localization

> support on the applicationlayer including content analysis

and system messages

localization in the ui <

internationalization provided by the backend keys only in the frontend <

entwine knowledge in motion

i18n

entwine knowledge in motion

local modifications

> obvious ones like workflow options configuration or hold states

> less obvious ones like support foradditional metadata fields

> completely unknown oneslike functional additions

a first walkthrough

entwine knowledge in motion

what’s new

> modern and consistent look and feel

> focus on events rather than workflows

> dedicated backend restful services for the ui

!

supports for roles by means of filtering and saved filters in all lists <

workflows by means of permanent urls <

entwine knowledge in motion

disclaimer

> we may not have managed to please everyone nor get everything right

the first time

> no user testing has been conducted so far

talk to espresslabs about design aspects <

entwine knowledge in motion

list views

entwine knowledge in motion

main navigation

entwine knowledge in motion

list views> actions

!

!

> filtering

> feedback

!

conclusion

entwine knowledge in motion

timeline

> entwine and its partners are in the state of refining the initial design work, wrapping up work on the front end and backend

we are expecting to finalize the workby the end of june 2014 <

> finalized means 80% of the originally intended design and close to 95%+ coverage of the current ui’s functionality

entwine knowledge in motion

get involved

> ui will be released as soon as it’s finished on a separate branch awaiting testing and feedback

feedback is welcome as are resources that help fund implementation of that feedback <

entwine knowledge in motion

closing remarks

> matterhorn will get a nice look and feel which will help convince potential adopters on the

non-technical level

getting started on customizing without coordination will ultimately lead to a fork <

> coordination will be the way to make sure the admin ui will serve the community