For years, the Austin Museum of Digital Art (AMODA) website was in desperate need of a revamp. So, in 2015, I migrated the entire site to WordPress and completely redesigned it. I used a responsive Genesis child theme, numerous plugins, and heavily modified CSS. To ensure consistency, I established and followed strict templates when building the dozens of pages. The results are below (and online here).
Home page of the AMODA website, which uses parallax scrolling. The background images were created by me using photos from past events, etc.
A standard page containing text and images. Note the sidebar with various widgets.
Another standard page. This one points to various sub-sections with prominent buttons and a sub-menu in the sidebar.
A list of all the organization's past events. I used a custom post type for the events (to keep the content well-organized).
An individual event page. The information was carefully formatted to ensure clarity, consistency/flexibility, and easy authoring.
The photo archive page, which points to individual galleries for past events. The photo gallery pages are another custom post type.
An individual photo gallery page. The gallery and lightbox features were built using NextGEN Gallery.
A form-based page. It was built using Gravity Forms plus custom CSS to better match the overall site.
The home page in mobile view. The simple layout easily adapts to small screens.
An individual event page in mobile view. Again, the content smoothly adjusts for small screens.
Mirror80
In 2010, my wife launched a design blog called Mirror80. I helped her initially set up the site in WordPress and have performed maintenance on it since. This includes installing all updates and recently migrating the site to a new web host. I’ve also redesigned the site several times over the years. The latest version can be seen below (and online here).
Home page of Mirror80. I selected the theme, configured the layout, installed numerous plugins, and heavily modified the CSS.
Lower half of the Mirror80 home page. It features a magazine-style layout and various widgets in the sidebar.
The top portion of an individual post on Mirror80 featuring text and images.
The bottom portion of a post on Mirror80. I set up plug-ins for the related posts, share buttons, and sidebar widgets.
The archive page for Mirror80.
The home page in tablet view. This layout was chosen to maximize image size (rather than a narrow main column plus sidebar).
Mobile layout of the home page.
Lower half of home page in mobile view. The widgets are all styled appropriately for small screen display.
I also set up an email list for Mirror80 using MailChimp. Each week's posts are automatically emailed to subscribers.
In addition, I helped design all Mirror80 branding and themed its social media profiles to fit the brand. (Tumblr pictured here.)
NMASS Festival
In 2014, I revamped the NMASS website in advance of that year’s festival. This involved installing a new responsive theme on their existing WordPress site and organizing/redesigning many pages of archival content. I also designed and built dozens of new pages, and implemented new custom post types on the back-end for better organization of future content.
Home page of NMASS website. NMASS is an annual festival of experimental music and digital art.
Line-up page of NMASS site. I designed and built it in WordPress using a responsive theme.
One of many artist bio pages. All content is implemented using responsive methods and collapses to a single column on mobile.
Another artist bio. Many of these pages required unique layouts to best fit the available content.
Schedule page on NMASS site. The table layout was chosen with mobile display in mind.
Appconomy
While working at this startup, I did quite a bit of UX design work (more info here). In addition, I designed mockups for a developer-oriented community site with a heavy Q&A component (pictured below). I then managed the implementation of this site in Drupal, working with an outside developer.
Mockup for the home page of a developer community site that I designed for Appconomy.
Mockup of Q&A page, which was modeled on StackOverflow.
Mockup of an individual question page, again similar to StackOverflow.
Mockup of the main page for reference documents, articles, and other resources.
Mockup of an individual technical article.
Ricochet Labs
While at this mobile app startup, I designed and built a B2B-focused website to complement their existing consumer-oriented site. I also made many small tweaks and additions to their consumer site. Both of these sites were built in ExpressionEngine.
Home page of a B2B-focused website that I designed and built for Ricochet Labs.
A page highlighting the benefits of QRANK for local businesses.
A page discussing the advantages of advertising inside of QRANK.
Common questions and answers about QRANK for business-owners.
Sign-up page where businesses could get the QRANK service.
Profile image for the QRANK Facebook and Twitter pages.
Landing tab image for the QRANK Facebook Page.
Home page of the QRANK consumer website. I added a Facebook button, business button, additional menu items, etc.
FAQ page of the QRANK consumer website. I updated this page frequently to keep users informed about issues.
Google Form that I integrated it into the QRANK consumer website.