Gabby Manotoc Design

Web Design

Web design projects I've designed and coded.

Views from the Sith

As Creative Director for Unrecorded.Mu, I often collaborate with writers and editors to built custom pages for long-form feature stories. This single page website was designed and built for custom, curated-playlists inspired by characters in the upcoming Star Wars film. Each week, a new playlist would be released. Therefore, the chapter-by-chapter publishing schedule required a page that would emphasize this narrative as well as provide a distinction between each new character.

The aesthetic combined the clean, contemporary look of Unrecorded with the galactic-colors of the Star Wars films. 

View the site here.

SCAD Secession

SCAD Secession is an annual juried show consisting of the best work of graphic design students graduating from SCAD. I was among the six graduating students to be chosen to lead the team that branded the entire exhibition. Following our collaborative effort on concepting and branding the show, I was then in charge of translating this into a website that would become live the day the winners were announced.

The entire site was built and designed with a Wordpress back end. I created a child-theme as well as curated the images that were published on the site, ensuring a high quality of photo submissions as well as ordering the pieces as to not clash with one another.

View the test site here.

The theme of the Secession 2015 show was "Intersections of Possibility," which explored the various layers and dimensions designers use when creating something. To bring this concept to the web, the beginning of the page uses a parallax style scrolling effect.

Unrecorded: Top Albums of 2016

As part of Unrecorded's year-end content, the team created a feature for the site's favorite albums of 2016. This feature was built out on its own microsite. The responsive page, uses the album art as the hero images, with a few write ups layered on top. The navigation style is made to showcase the art (in thumbnail form), with the hierarchy of the albums in the list corresponding to their size.

View the site here.


Unfiltered is the exclusive photography section of Unrecorded.Mu. Photographers for the site capture exciting moments of live music performances which are then published on the larger site. With a focus on stunning imagery and minimal text, the section focuses on a simple design that allows the visuals to shine on their own. 

I hand-coded this section to be mobile-responsive as well as cater to the needs of each gallery. This was then added to the original wordpress based site with some light PHP.

View the section here.
Clicking a thumbnail in the gallery simply opens a large view of the image in a full-screen light box. Users can use their arrow keys or click the arrows on screen to scroll through.

Fun Fact