Role
UX Design & Engineer Intern
Timeline
June 2024 - August 2024
Team
Johanna Lee
James Kafader (Supervisor)
Ken Miller (Client Point of Contact)
Skills
Problem Space
Introduction
Energy Science Network (ESnet) is a high-performance network designed to support large-scale scientific research by interconnecting the U.S. Department of Energy's national laboratory system. As part of ESNet's measurement and analysis team, I worked on the Modern Research Data Portal as UX engineer intern.
Modern Research Data Portal (MRDP)
An interface that improves scientific data sharing by separating data management into three components: a portal server, a high-performance network (Science DMZ), and a data service (Globus).
Who is this for?
Problem
Modern Research Data Portal's current interface and customization workflows are not user-friendly. We're exploring solutions to simplify these processes, enabling research institutions to easily manage and customize their data portals.
How might we simplify data portal user flow, customization, and management for ESnet partner research institutions through Modern Research Data Portal?
Problem Analysis
UX Audit
I initiated the redesign process by performing a thorough audit of the original MRDP interface, aiming to identify key areas for improvement, and then synthesized my findings into a SWOT analysis.
SWOT Analysis
Competitor Research
To gain a comprehensive understanding of industry standards, I conducted competitive analysis, exploring numerous software tool landing pages and competitor interfaces. I then synthesized my findings into a FigJam brainstorm, visually organizing key insights.
Interview with Client Point of Contact
In a meeting with our client point of contact, we discussed the current pain points of MRDP. He provided guidance on UX design improvements and codebase restructuring.
Key Takeaways
MRDP needs a proper landing page dedicated to customizable content catered to host institution or lab
Common feature around other competitor interfaces is a instruction page or section that guide first users
Focus on the Django version of the Globus data portal, using data.lsstdesc.org as an example. Similarly, our data search functionality can be removed for now.
Implement customization entrypoints to allow research institutions to add custom pages (e.g., "Our Team" or institution-specific pages) using Django template functionality.
Problem Solving
Low-fidelity Mockups
I determined that the essential user needs of MRDP could be addressed through two pivotal pages, distilling the user flow to the landing page and the transfer page.
The landing page was designed to act as a central hub, providing access to key information and functionalities, while the transfer page was structured to streamline and simplify the data transfer process.
Landing Page
Using the comparative analysis, I redesigned landing page to incorporate:
- Introduction Section to provide summary and login entry point
- Instruction Section that guides users to access the transfer page through logging in
- Featured Datasets Section to highlight from institute
- Customization section that include e.g., team or institution introductions
Transfer Page
I merged the search and transfer page to streamline the process of finding source and destination points, taking inspiration from travel booking and cloud storage platforms.
Transfer Steps:
- Once user logs in, users have the option to select the source, destination, and dataset to transfer
- Source and destination search expands so that users can choose and scroll through
- Search engine allows users to filter through datasets and find an appropriate one
- Once selected, dataset should be added to the transfer queue
- Check transfer queue as a final confirmation of datasets to transfer
High-fidelity Mockups
Following client approval of the low-fidelity mockups and user flow, I proceeded to develop a high-fidelity prototype that showcased the customization capabilities of MRDP. This included a detailed example featuring ESNet's branding, such as logos and color schemes, as well as tailored content to demonstrate how partner institutions could personalize their data portal experience.
Core Improvements
- Optimized Transfer Workflow: Streamlined the source-to-destination selection process, creating an intuitive transfer experience.
- Enabled Customization Access: Integrated clear entry points on the landing page, allowing partner institutions to easily tailor their portal's content.
- Enhanced File Navigation: Simplified dataset browsing within source nodes, improving user efficiency.
- Improved Directory Tracking: Implemented a breadcrumb trail, enabling users to easily navigate file locations.
- Organized Transfer Management: Introduced a transfer queue, providing clear visibility of selected files and transfer status, reducing errors.
Final Deliverable
Development
During development, I focused on building a clean, digestible codebase to simplify MRDP customization for research institutions.
This deployment was delivered to the Science Engagement Team in order to distribute to any ESnet's partner administrators that requires MRDP.
Reflection
Student Poster Session for Berkeley Lab Computing Sciences
Presenting to ESNet Executive Director Inder Monga
User Flow Redesign
My project aimed to design for a niche group of lab researchers, shifting my focus from previous GenZ targeting design projects. I aimed to create a UX that prioritized versatility and approachability, leading to a redesign of the website's user flow, which simplified navigation by consolidating two-page operations into a efficient single-page experience.
Balancing Usability and Developer Adaptability
Another focus was creating templates that future developers could easily customize, ensuring that my design was both user-friendly for end-users and adaptable for developers. This experience broadened my perspective on user experience design and highlighted the importance of balancing technical requirements with usability.
Los Angeles, CA
© 2025 Johanna Lee