Case Studies
Mein Portfolio
Project at a Glance
The Program in Writing and Communication and the Center for Academic and Professional Communication serve students through writing courses, academic resources, and individual consultation services. Their websites needed to communicate these offerings clearly while giving departmental staff a practical way to maintain changing content. My work combined website migration from Wordpress, interface design, front-end development, accessibility collaboration, and content-management workflow improvements. In addition to redesigning the user experience, I built custom components and helped establish a course-publishing process using Rice University's Events Calendar using third-party service, LiveWhale and existing infrastructure with Drupal.

The Problem: Modernizing Legacy Websites & Improving Student Access
The original PWC website used WordPress and needed to be migrated and redesigned within Rice University's Drupal environment. The websites required more than a change of CMS: content organization, page layouts, interactive elements, and responsive behavior needed to be reconsidered. Students needed clear access to course information, writing resources, and consultation services. Departmental staff and student interns needed a sustainable way to publish and maintain content without relying on a complicated technical process.
Several challenges intersected:
-
Legacy page structures and dated layouts needed to be reorganized.
-
Standard page templates did not provide all the interface elements the departments needed.
-
Stakeholder-requested flip cards needed refinement to work across screen sizes and meet accessibility requirements.
-
Students needed a more readable way to explore First-Year Writing Intensive Seminar course topics rather than the outdated and dense legacy registrar catalog.
-
Staff needed a workable publishing process for frequently changing course information.
The challenge was to deliver a more usable experience while working within the university's existing CMS environment, technical constraints, accessibility requirements, and departmental workflows.
​
Website Migration, User Experience & Information Architecture
WordPress-to-Drupal Migration
Migrated and redesigned the PWC website within Rice University's Drupal environment, restructuring content and page layouts to create a more consistent, responsive experience. The work involved organizing information around student needs, improving page hierarchy, and adapting the presentation of departmental resources to the new platform. The related CAPC experience also needed clear pathways to consultation services and other student-facing information.
Content Organization & Student Journeys
Focused the page structure on the information students needed to find: course information, writing resources, program details, and consultation opportunities. The goal was to make the websites easier to scan and navigate while giving staff a more consistent foundation for publishing and updating content.
.png)
Solutions & Staff Training Sessions
​
The workflow required departmental staff and student interns to manage course entries because professors were not directly maintaining the listings through this process. I provided hands-on LiveWhale and Drupal training and helped establish repeatable content-management procedures so staff could publish and maintain the information after implementation. This part of the project addressed an operational problem as well as a design problem: a new interface would not remain useful unless the department could reliably keep its content up to date.
Problems Solved:
-
Migrated the PWC website from WordPress into the university's Drupal environment.
-
Redesigned related student-facing content and page structures.
-
Built custom front-end components where standard templates were insufficient.
-
Refined stakeholder-requested flip cards to address responsive behavior and accessibility.
-
Created a custom consultation interface for CAPC.
-
Replaced dense course listings with a more scannable course-topic experience.
-
Connected LiveWhale content to Drupal rather than introducing another publishing platform.
-
Established and taught a repeatable course-content workflow for departmental staff and interns.
Custom Front-End Development: HTML, CSS & JavaScript
Where standard CMS components did not meet the project's needs, I designed and developed custom interface elements.
-
Responsive Carousel: Built a custom carousel using HTML, CSS, and JavaScript, adapting its layout and behavior for different screen sizes.
​
-
Reusable Custom Content Blocks: Developed custom page components to support more flexible layouts and consistent content presentation across the websites.
​
-
Back-to-Top Interaction: Implemented a custom back-to-top control using CSS and JavaScript to help users navigate longer pages.
​
-
CAPC Consultation Interface: Created a slide-out consultation modal that provided a clearer route to CAPC consultation services. The interaction was designed to make the next step more visible without requiring users to search through unrelated page content.
​
-
Accessible Flip Cards: Their visual presentation was important to stakeholders, but the initial approach needed further work to function reliably across different screen sizes and support accessible interaction. I iterated on the implementation, refining responsive behavior and working with the university's accessibility team to address the relevant requirements. The resulting component approach received accessibility team approval. This work required balancing stakeholder preferences with usability, responsive design, and accessibility—not simply implementing a requested visual treatment unchanged.
​
Takeaway & Project Reflection
The project delivered redesigned departmental websites supported by custom front-end components, improved content organization, and a more structured course-discovery experience. The custom elements expanded the capabilities of the standard CMS environment. Accessibility collaboration helped refine interactive components, while LiveWhale integration and staff training supported ongoing content maintenance.
The work brought UX design, front-end development, accessibility, CMS integration, and operational training together to improve both the student-facing experience and the department's ability to maintain it.
.png)

