Lin Jackson

Full-Stack Developer

Most Recently: Purple, Rock, Scissors

At PRPL I worked primarily as a developer with input to strategy, design, and project management with clients including Adult Swim/Cartoon Network, DC Comics, Detroit Institute of Arts, National Museum of Women in the Arts, Intrepid Museum, Hilton Grand Vacations, AdventHealth, Evermore Resort, and others.

Projects:

Rick and Morty Wormageddon

  • Adult Swim was preparing to premiere Rick and Morty Season Six. To promote the launch, a storyline was tied in depicting a group of alien worms threatening Earth. The worms and several show characters popped up at 14 secret locations around the world.
  • We built a mobile-first website with clues to lead fans to the locations, and the first to find each of them won a prize. We built a React/NextJS web app to house countdowns, videos, and clues.
  • I developed some of the components, and focused on localizing the site with a number of different translations, as well as making sure the site met accessibility best practices.
  • The project was a success and went smoothly. Prior to the first reveal, fans created a subreddit and began sharing theories and inspecting the code of the site. We built it with security in mind, with all of the sensitive information protected behind an API, so we were confident in the security of the app.
  • The site received 725K total visits globally, 427K unique visits, and 61K minutes of video content watched.
Read PRPL Wormageddon Case Study

Detroit Institute of Arts

  • Detroit Institute of Arts came to PRPL to redesign and rebuild their website for a sleeker, more modern, and smoother online presence.
  • DIA was previously using Drupal 7, and we built the new site on the updated Drupal 9 platform for a more modern and robust, but still familiar admin experience.
  • I led most of the technical and development aspects of the site, including planning and building CMS architecture and integrating with DIA’s in-house API hosting their entire collection of artwork including over 65,000 pieces of artwork. The website displays collection items directly from the API to make content management easier, and we made the rest of the site content easily customizable with reusable components to lay out pages and connect related content.
  • We delivered DIA an improved website with increased traffic, and expanded their reach with both online and in-person visitors. DIA saw a 49% increase in time spent exploring their online art collection, a 58% increase in traffic to their events and calendar, and a 50% increase in traffic to plan a visit.
Read PRPL DIA Case Study

Go Rick Yourself

  • As part of the lead up to Rick and Morty Season Five, Adult Swim wanted to create a place for fans to build their own avatar inspired by the show.
  • We built a React/NextJS web app allowing users to select body parts and accessories to create their own character and choose a background. At the end users were able to download their image or share directly to social media, and for a limited time they were able to order a custom-printed shirt with their design.
  • I developed some of the components and handled most of the logic when certain part selections were incompatible with others. I also worked on localizing the app with several languages and ensuring accessibility best practices were followed.
  • The project was a success and people were talking about the site and their characters, and some custom characters aired on Adult Swim during the premiere.

AdventHealth Research Institute

  • AdventHealth Research Institute came to PRPL to rebuild their website and improve their online presence and showcase all their clinical trials.
  • AHRI’s previous site was built on Drupal, and we built the new site on Drupal according to their preference and for familiarity and functionality. We divided the project into phases, and the first phase was focused on building the informational portion of their website along with a way to manually enter and showcase clinical trials. The next phase of the project coincided with their internal launch of a new clinical trial management system that exposed trial information via an API. I built a custom Drupal module to import this data and save it in Drupal as content, replacing the manual entry of over 900 clinical trials. The next phase of the project was to interface with a similar system they launched containing physician biographical information and publications and showcase this data on the website automatically.
  • AHRI was able to improve and streamline their web presence and showcase their clinical trials to increase awareness and enrollment.

Mason

  • Mason approached PRPL to evolve their web presence into a cleaner, more modern look.
  • They were previously on WordPress and wanted to stick with that platform for their new build. We built the new site using custom blocks combined with the Advanced Custom Fields plugin to enable a library of custom-built interactive blocks and easily editable page layouts.
  • I was the primary developer for the project and built out most of the blocks and the theme styles and managed the deployment process.
  • As a result of the project, Mason improved the look and feel of their site, along with the functionality for site editors and viewers.

Hilton Grand Vacations Explore

  • HGV came to PRPL for a pilot project for their Explore program to retarget customers who had attended timeshare presentations. Customers would receive a personalized email with an invitation to view the Explore website and access exclusive offers.
  • I built this site in Drupal and created a custom module to interface with MailChimp and provide limited access to the site. HGV would send PRPL a list of contacts and we would upload it to their MailChimp account. A custom webhook would trigger the Explore site to fetch new contacts from MailChimp and create access tokens for the site via a hash function. The site then added those access tokens to the MailChimp contacts, and the tokens were included in the email calls to action. When viewing the site, an access token was required to see and interact with any site content; otherwise a user was presented with a message that the exclusive offer was not available. The access tokens were created with an expiration date, after which they would no longer allow access to the site. The final emails the customers would receive included countdowns generated as an animated GIF within the custom Drupal module counting down to their specific expiration time from the current time.
  • Through this site HGV was able to retarget customers with a second-chance opportunity and offer exclusive deals.

DC FanDome: (Not So) Secret Origins

  • DC Comics approached PRPL with an idea for a custom avatar builder for the DC FanDome at home experience after Warner Media’s success with the Go Rick Yourself project.
  • We built a React/NextJS app where users could build their own DC Comics character from a set of comic book parts and genres. After building the avatar users could download the finished image and share directly to social media. I focused on building out several components and working through the logic of which parts could work together and handling the cases that didn’t, along with localizing to several languages and ensuring the app followed accessibility best practices.
  • This was part of the DC FanDome event and there was significant media coverage and social buzz about the experience.

Intrepid Museum

  • Led front-end development and theming to build and style static and interactive site components with vanilla JS and jQuery. Built and integrated components and functionality for museum ticketing React app interfacing with third-party API, and developed museum map React app.

Previous Work:

Wycliffe USA

On the marketing team at Wycliffe I provided marketing and fundraising support for an organization with an annual budget of over $200M and a staff of over 3,000 in 71 countries supporting translation projects in more than 2,100 out of an estimated 7,000 languages spoken worldwide. I headed up building a new site template for the SiteStacker CMS from scratch to match the organization’s updated brand and improve website performance. I built out a pattern library of modular components and built them into the site’s design system. Following this project, the marketing team developed quarterly themes to connect with our audience, and I focused on building out themed landing pages and content pages in an agile scrum process to drive awareness, engagement, and fundraising, along with building reusable email templates and maintaining webforms for tablets in our museum. I also worked on some internal resources and provided technical support in live-streaming town hall meetings to a worldwide distributed team.

RELEVANT Magazine

This had definitely been the largest project I had undertaken. The former RELEVANT Magazine site was an aging installation of Joomla! 1.5, and was in dire need of replacement. It was hacked together and routinely took more than 15–30 seconds to load, during which you could see layer upon layer of background image come into the picture. Because of the way Joomla! functioned, everything had to be shoehorned into a standard article template, even if it was some other type of content. The limitation of sections and a single level of categories combined with the separate back-end made article management a nightmare. The decision was made to revamp the site, with Tanya Elshahawi providing the vast majority of the design comps, David Barratt handling back-end development and contributing to information architecture and organization, and myself tackling the front-end and content formatting. Later on in the process, Christina Cooper and Evan Travelstead contributed some designs, and Steven Linn assisted with some of the development and production work.

Drupal was chosen as the platform for the new site because it provided much more flexibility. It allows for specialized content types rather than just articles, meaning we could design templates specifically for a web article, a premium magazine article, a video, a product in the store, a music or movie review, a short post, a podcast episode, and various other types; and its hierarchical taxonomy system makes organizing content much easier. The field API allows for various types of metadata to be added to each node. One such example is the issue of embedded media. On the former Joomla! site, an editor or developer would copy the embed code of a video or other item and paste it into the article body—a messy way to handle it. On the new site, all that is needed is for the URL of the item to be pasted into a text field in the article editor, and the embed code is automatically fetched using oEmbed APIs, and stored separately from the article text, enabling some abstraction and separation of article content from media player markup. We also routinely created landing pages, which were fundamentally different from articles. On Joomla!, we had to paste all the HTML for the page into the article body and then modify the site’s main CSS. On the new site, we just created a special node type for landing pages that doesn’t inherit any of the article styles, and we can attach a separate stylesheet for it.

Another huge step we took was the addition of premium magazine content on the site accessible to subscribers. This presented challenges in terms of creating multiple access levels for users, designing and styling multiple layouts for these articles, as well as creating table of contents pages to gather all the articles from an issue, and automating and streamlining the process of “posting” an issue so it would be less of a burden on the digital team each time. We also used this as a way of introducing user accounts and developed user profiles, integrating this with author bios, store customer information, and eventually migrating to Drupal’s integrated commenting system from Disqus. We also used these accounts for our print subscribers to access our iPad magazine, with our Mag+-based app having a window that opened a special “my account” window from our website. Videos from the issues are also embedded on a specific template on the site and opened in a window through the app.

As the old content was imported and the new content entered, we developed the Drupal theme from the ground up and the inside out, adding additional sections to the site post-launch. In building this custom theme, I incorporated web fonts and icon fonts, even learning some of the ins and outs of SVG fonts, and as much building elements with pure CSS rather than images (with as little extra markup) as possible. The project comprised the better part of 2012 with me leading front-end development on the site until January 2013, and contributing until April 2013. I also headed up all operations of the site from October 2012 until January 2013, and contributed until April 2013.

Reject Apathy

At the time, this was the largest project I had taken on. Reject Apathy is a section of RELEVANT Magazine that focuses on social justice issues. The site was originally a subsection of the former RELEVANT Joomla! 1.5 site (and has now been rolled back into the new RELEVANT Drupal site, after having lived at its own domain for a little over a year). The Reject Apathy site was built on a Joomla! 1.6 platform, which had substantial improvements over 1.5, such as nested categories, better user and permission management, a cleaner admin UI, among other things. The site design was comped by Tanya Elshahawi, and the back-end development was done by David Barratt. The Reject Apathy Joomla! template was built from the ground up and the inside out.

Operation Christmas Child

Operation Christmas Child hired RELEVANT to create a video and microsite promoting their cause. Evan Travelstead created the graphics and animation, along with the site design, and I implemented the site’s HTML and CSS using the landing page platform on the new RELEVANTmagazine.com.