[cmsms_row data_padding_bottom=”50″ data_padding_top=”0″ data_color=”default” data_padding_right=”0″ data_padding_left=”0″ data_width=”fullwidth”][cmsms_column data_width=”1/1″][cmsms_image align=”center” animation_delay=”0″]2825|http://shannoncui.com/wp-content/uploads/2019/06/learning-cover.png|full[/cmsms_image][/cmsms_column][/cmsms_row][cmsms_row data_width=”fullwidth” data_padding_left=”22″ data_padding_right=”22″ data_color=”default” data_padding_top=”30″ data_padding_bottom=”10″][cmsms_column data_width=”1/1″][cmsms_text animation_delay=”0″]

Introduction

Oracle Learning Cloud provides enterprise with learning platform that helps companies develop and retain talent. It is one of the applications in Oracle Human Capital Management (HCM) Cloud and integrates with HCM’s Core HR and Talent Management. Starting at the end of 2017 Learning participated in HCM redesign efforts. Our goal is to deliver the MVP version with new responsive design pattern, targeting for the recent 3 releases in 2018.

HCM is a highly complicated and large-scale enterprise web application. The current interface feels very cumbersome, laborious and outdated, which is adding complexity to users. In the meantime, our biggest competitor Workday is devoting efforts to user experience. The ongoing redesign has received many positive feedback from customers. We are applying responsive design pattern to every work area.

My Role

I collaborated with Aaron who is a great designer from Learning product team. In the design phase, we broke down Learning into several projects. Each of us works separately and we meet frequently to show progress and give feedback. I owned the designs of learner self-service experience, learning content creation experience and learning catalog redesign. Aaron created manager self-service experience and learning assignment and classroom flows.

[/cmsms_text][/cmsms_column][/cmsms_row][cmsms_row data_padding_bottom=”0″ data_padding_top=”30″ data_color=”default” data_padding_right=”22″ data_padding_left=”22″ data_width=”fullwidth”][cmsms_column data_width=”1/1″][cmsms_text animation_delay=”0″]

The Problem

Enterprise learning platform is essential to corporates especially for internal mobility. Our customers think highly of investing in their employees’ career development. From interviews we conducted at HCM conferences with customers and onsite at Oracle, there are several major problems with the current Learning Cloud:

[/cmsms_text][/cmsms_column][/cmsms_row][cmsms_row data_padding_bottom=”0″ data_padding_top=”0″ data_color=”default” data_padding_right=”20″ data_padding_left=”20″ data_width=”fullwidth”][cmsms_column data_width=”1/1″][cmsms_image align=”none” animation_delay=”0″]2839|http://shannoncui.com/wp-content/uploads/2019/06/learning-problem1.jpg|full[/cmsms_image][/cmsms_column][/cmsms_row][cmsms_row data_padding_bottom=”0″ data_padding_top=”10″ data_color=”default” data_padding_right=”22″ data_padding_left=”22″ data_width=”fullwidth”][cmsms_column data_width=”1/1″][cmsms_text animation_delay=”0″]

Regarding this finding, we did a competitor analysis. And we sorted popular e-learning products into two categories:

[/cmsms_text][/cmsms_column][/cmsms_row][cmsms_row data_padding_bottom=”70″ data_padding_top=”10″ data_color=”default” data_padding_right=”20″ data_padding_left=”20″ data_width=”fullwidth”][cmsms_column data_width=”1/1″][cmsms_image align=”none” animation_delay=”0″]2940|http://shannoncui.com/wp-content/uploads/2019/06/learning-competitor_D.jpg|full[/cmsms_image][/cmsms_column][/cmsms_row][cmsms_row data_padding_bottom=”20″ data_padding_top=”0″ data_color=”default” data_padding_right=”20″ data_padding_left=”20″ data_width=”fullwidth”][cmsms_column data_width=”1/1″][cmsms_image align=”none” animation_delay=”0″]2843|http://shannoncui.com/wp-content/uploads/2019/06/learning-problem2.jpg|full[/cmsms_image][/cmsms_column][/cmsms_row][cmsms_row data_padding_bottom=”10″ data_padding_top=”0″ data_color=”default” data_padding_right=”20″ data_padding_left=”20″ data_width=”fullwidth”][cmsms_column data_width=”1/1″][cmsms_image align=”none” animation_delay=”0″]2844|http://shannoncui.com/wp-content/uploads/2019/06/learning-problem3.jpg|full[/cmsms_image][/cmsms_column][/cmsms_row][cmsms_row data_padding_bottom=”0″ data_padding_top=”50″ data_color=”default” data_padding_right=”22″ data_padding_left=”22″ data_width=”fullwidth”][cmsms_column data_width=”1/1″][cmsms_text animation_delay=”0″]

Design Direction

We ideated around solving the problems of how might we increase user retention and engagement in Learning:

[/cmsms_text][/cmsms_column][/cmsms_row][cmsms_row data_width=”fullwidth” data_padding_left=”21″ data_padding_right=”21″ data_color=”default” data_padding_top=”0″ data_padding_bottom=”5″][cmsms_column data_width=”1/1″][cmsms_image align=”none” animation_delay=”0″]2877|http://shannoncui.com/wp-content/uploads/2019/06/learning-solution1.jpg|full[/cmsms_image][/cmsms_column][/cmsms_row][cmsms_row data_width=”fullwidth” data_padding_left=”21″ data_padding_right=”21″ data_color=”default” data_padding_top=”10″ data_padding_bottom=”5″][cmsms_column data_width=”1/1″][cmsms_image align=”none” animation_delay=”0″]2878|http://shannoncui.com/wp-content/uploads/2019/06/learning-solution2.jpg|full[/cmsms_image][/cmsms_column][/cmsms_row][cmsms_row data_width=”fullwidth” data_padding_left=”21″ data_padding_right=”21″ data_color=”default” data_padding_top=”10″ data_padding_bottom=”0″][cmsms_column data_width=”1/1″][cmsms_image align=”none” animation_delay=”0″]2879|http://shannoncui.com/wp-content/uploads/2019/06/learning-solution3.jpg|full[/cmsms_image][/cmsms_column][/cmsms_row][cmsms_row data_width=”fullwidth” data_padding_left=”22″ data_padding_right=”22″ data_color=”default” data_padding_top=”0″ data_padding_bottom=”10″][cmsms_column data_width=”1/1″][cmsms_text animation_delay=”0″]

^{Case study of Author Tutorial: http://shannoncui.com/learning-author-tutorial/}

[/cmsms_text][/cmsms_column][/cmsms_row][cmsms_row data_padding_bottom=”5″ data_padding_top=”80″ data_color=”default” data_padding_right=”22″ data_padding_left=”22″ data_width=”fullwidth”][cmsms_column data_width=”1/1″][cmsms_text animation_delay=”0″]

Landing Page

[/cmsms_text]

[cmsms_divider type=”transparent” margin_top=”0″ margin_bottom=”40″ animation_delay=”0″]

[cmsms_text animation_delay=”0″]

Previous design

[/cmsms_text][/cmsms_column][/cmsms_row][cmsms_row data_width=”fullwidth” data_padding_left=”22″ data_padding_right=”22″ data_color=”default” data_padding_top=”0″ data_padding_bottom=”10″][cmsms_column data_width=”1/1″][cmsms_image align=”center” animation_delay=”0″]2882|http://shannoncui.com/wp-content/uploads/2019/06/landing-page-prob.png|full[/cmsms_image][/cmsms_column][/cmsms_row][cmsms_row data_padding_bottom=”0″ data_padding_top=”50″ data_color=”default” data_padding_right=”22″ data_padding_left=”22″ data_width=”fullwidth”][cmsms_column data_width=”1/1″][cmsms_text animation_delay=”0″]

Redesign

[/cmsms_text][/cmsms_column][/cmsms_row][cmsms_row data_width=”fullwidth” data_padding_left=”3″ data_padding_right=”7″ data_color=”default” data_padding_top=”0″ data_padding_bottom=”10″][cmsms_column data_width=”1/1″][cmsms_image align=”none” animation_delay=”0″]2884|http://shannoncui.com/wp-content/uploads/2019/06/[email protected]|full[/cmsms_image][/cmsms_column][/cmsms_row][cmsms_row data_width=”fullwidth” data_padding_left=”22″ data_padding_right=”22″ data_color=”default” data_padding_top=”20″ data_padding_bottom=”20″][cmsms_column data_width=”1/1″][cmsms_text animation_delay=”0″]

The biggest change is that we completely removed content cards. This is aligned with our strategy for landing page, to be task oriented, and to avoid long scrolling content. A more organized learning exploration can be viewed under “Suggested for you”.

[/cmsms_text][/cmsms_column][/cmsms_row][cmsms_row data_width=”fullwidth” data_padding_left=”3″ data_padding_right=”3″ data_color=”default” data_padding_top=”30″ data_padding_bottom=”10″][cmsms_column data_width=”1/1″][cmsms_image align=”none” animation_delay=”0″]2893|http://shannoncui.com/wp-content/uploads/2019/06/landing-page-iteration_b.png|full[/cmsms_image][/cmsms_column][/cmsms_row][cmsms_row data_width=”fullwidth” data_padding_left=”22″ data_padding_right=”22″ data_color=”default” data_padding_top=”120″ data_padding_bottom=”10″][cmsms_column data_width=”1/1″][cmsms_text animation_delay=”0″]

Before diving into each individual flow, we started to design the “component” of learning items, as many flows will include these “component”: learning item summary view, learning item details page, learning assignment summary view and learning assignment details page (designed by Aaron).

[/cmsms_text][/cmsms_column][/cmsms_row][cmsms_row data_padding_bottom=”120″ data_padding_top=”0″ data_color=”default” data_padding_right=”8″ data_padding_left=”15″ data_width=”fullwidth”][cmsms_column data_width=”1/1″][cmsms_image align=”none” animation_delay=”0″]2952|http://shannoncui.com/wp-content/uploads/2019/07/[email protected]|full[/cmsms_image][/cmsms_column][/cmsms_row][cmsms_row data_width=”fullwidth” data_padding_left=”22″ data_padding_right=”22″ data_color=”default” data_padding_top=”0″ data_padding_bottom=”0″][cmsms_column data_width=”1/1″][cmsms_text animation_delay=”0″]

Learning item summary design

I had a dedicated design session for learning list view design, items including course, specialization, community, tutorial and video. Collaborated with list view pattern owner and visual designers to polish the final design, which can be used in multiple flows in Learning.

[/cmsms_text][/cmsms_column][/cmsms_row][cmsms_row data_padding_bottom=”0″ data_padding_top=”0″ data_color=”default” data_padding_right=”18″ data_padding_left=”18″ data_width=”fullwidth”][cmsms_column data_width=”1/1″][cmsms_text animation_delay=”0″]

[R-slider id=”3″]

[/cmsms_text][/cmsms_column][/cmsms_row][cmsms_row data_padding_bottom=”50″ data_padding_top=”0″ data_color=”default” data_padding_right=”22″ data_padding_left=”22″ data_width=”fullwidth”][cmsms_column data_width=”1/1″][cmsms_text animation_delay=”0″]

List view is more compact comparing to card view when text is heavy. Especially on mobile, it requires less vertical space. So we decided that Card view will not be in the scope of MVP. On each learning item, elevate the interesting facts that will push users to click into details and sign up. Initially I put skills on each item until most users said they can get a sense of what skills they can gain from the learning item title. To lighten the list view I take off skills in the final design.

[/cmsms_text][/cmsms_column][/cmsms_row][cmsms_row data_padding_bottom=”0″ data_padding_top=”0″ data_color=”default” data_padding_right=”22″ data_padding_left=”22″ data_width=”fullwidth”][cmsms_column data_width=”1/1″][cmsms_text animation_delay=”0″]

Learning item details pages

Right after learning item summary, I started the design for learning item details pages. Apart from an eye-catching look and feel, there are a couple of considerations I kept in mind throughout the design process:

Prioritize information in an efficient order
Learning items can be presented to learners in two states: before enrollment and after enrollment (for learning community it’s subscribed and not yet subscribed).
Courses are offered through different modalities: self paced, instructor led online, instructor led in person. Simplify the interaction when learners need to choose an offering.

[/cmsms_text][/cmsms_column][/cmsms_row][cmsms_row data_width=”fullwidth” data_padding_left=”8″ data_padding_right=”8″ data_color=”default” data_padding_top=”20″ data_padding_bottom=”170″][cmsms_column data_width=”1/1″]

[cmsms_slider slider_plugin=”layer” slider_layer=”2″]

[/cmsms_column][/cmsms_row][cmsms_row data_padding_bottom=”0″ data_padding_top=”30″ data_color=”default” data_padding_right=”22″ data_padding_left=”22″ data_width=”fullwidth”][cmsms_column data_width=”1/1″][cmsms_text animation_delay=”0″]

Suggested for You

“Suggested for You” will curate the right content that users would want to explore and come back for. Algorithm is based on users’ recent search, their job profile, career interest and what’s popular among people like you.

[/cmsms_text][/cmsms_column][/cmsms_row][cmsms_row data_padding_bottom=”150″ data_padding_top=”20″ data_color=”default” data_padding_right=”8″ data_padding_left=”8″ data_width=”fullwidth”][cmsms_column data_width=”1/1″]

[cmsms_slider slider_plugin=”layer” slider_layer=”3″]

[/cmsms_column][/cmsms_row]