Professional Development Center

Practicing Law Institute needed an ancillary platform to offer additional learning resources to legal professionals. I designed and built the microsite, including overall concept, visual elements and assets and the final coded website.

Professional Development Center Home

Product Mapping

I collaborated with the R&D team to understand and define the needs of our users. We iterated on how to best streamline our offerings into an organized structure allowing for multiple formats of learning materials including informational video series and downloadable checklists and templates and ultimately came up with this:

navigation

Video Series Flow

To organize the video series into the site, I drew inspiration from popular TV and streaming services and how they organize shows. There's a screen showing thumbnails for all the shows, that a user could click on to see the episodes within that show, and then click on an episode to open up a video player and consume the content. To ease the learning curve of a new experience for users, my strategy was to leverage a pattern most are already familiar with and would know how to navigate.

navigation

Full Screens

On the left is the full home screen, and on the right you see the clickthrough showing the view with the video series and then the video player at the bottom.

navigation navigation

Highlights

Design System This was one of my early experiences working with tokens and coded components. It showed me firsthand the connection between how well systems work in practice and how well they are structured.
Interactions I played with scroll-based animations and button and menu item states. I gained an appreciation for how deep interaction design can go if afforded the space.
Aesthetic In keeping with the overall rebrand, I experimented with the popular Swiss style aesthetic using our new logo, palette, type and general style rules.

User Feedback

The team received feedback from users that the site's look and feel was polished and cutting edge. In the following years, it informed the creative direction when redesigning the company's larger platforms including pli.edu.