Category: Design

Posted on

Marketo Landing Pages

Project Details:

USGBC uses Marketo to collect user submitted information for targeted marketing. Although Marketo makes digital marketing easier, the platform isn’t mobile-friendly. The drag-and-drop designer makes it easier for non-coders to create landing pages, however it makes it difficult to create responsive and easily adjusted pages.

I worked on editing the CSS and found a workaround for targeting the long and obscure classes that Marketo’s designer automatically generates. I then created templates that our creative team could use to make responsive and mobile-friendly landing pages.

Programs Used:

  • Marketo

Marketo Landing Page

Marketo Landing Page

marketo-landing-page-1-mobile

Marketo Landing Page

Posted on

Megan Coyle: Collage Artist Portfolio

Project Details:

mcoyle.com
I created this website for my studio collage work. I designed the logo myself and took pictures of the artwork. Aside from designing the site, I have managed and maintained it since 2007.

Programs & Technology Used:

  • jQuery
  • JavaScript
  • CSS & HTML
  • PHP
  • Photoshop
  • Illustrator
  • InDesign
  • WordPress (CMS)

Megan Coyle Collage Artist Website

Posted on

EDGE Website

Project Details:

edge.gbci.org
EDGE started out as a simple site created on Drupal. I worked on styling the overall website as well as selecting banner images for different pages and creating icons to add more interest to text-heavy pages. I also added JavaScript functionality to make different sections more interactive.

Programs Used:

  • Photoshop
  • Illustrator
  • Drupal (CMS)

EDGE Website

Posted on

New Video Background for USGBC

Every now and then I get design-related projects with my work at USGBC. The other day I worked on cutting together videos of buildings for a new video background on USGBC’s main website. I added a consistent filter so the videos would look somewhat similar. I haven’t worked too much with video before, so it was interesting putting together something with iMovie. It’s inspired me to make a few videos for my studio art-related work sometime in the future.

USGBC building

USGBC building

Posted on

PEER Website

Project Details:

peer.gbci.org
PEER was in need of an full website redesign. I began the process by creating wireframes for the user experience. Next, I developed and designed the website in Drupal. Images were Photoshopped and added to the necessary pages. I also designed icons in Illustrator to use on a couple of the pages. CSS and Javascript were used to make the website more interactive as well as responsive.

Programs Used:

  • Photoshop
  • Illustrator
  • Drupal (CMS)

PEER Website

Posted on

Redesigning USGBC.org’s Homepage

Earlier this year, I worked on reworking USGBC.org’s homepage. The main navigation was also reworked and was launched in conjunction with the homepage redesign project.

Previously, the homepage looked like this:

USGBC's website

As you can see, the logo and search box appeared right below the main navigation on every page. Thus the header took up quite a bit of real estate. The homepage itself had a carousel with banner images that were swapped out every few months.

I worked on redesigning the header so that the logo, search box, and navigational links all existed on the same line. For the homepage, instead of using a carousel, I worked on adding a video background with a text overlay and a call-to-action button. Here’s the final look:

USGBC's website

Overall, it was very exciting to refresh the look and feel of the website by making a few enhancements to the homepage, as well as the overall website layout.