Marc Fairbrother

Festival Scope Pro

• Project Manager
• UX & UI Designer
• Front-End Developer

Festival Scope Pro is a VOD service used by over 10,000 film professionals yearly.

Selected titles in search of visibility and distribution opportunities are made available for online screening in partnership with over 100 international film festivals and organizations.

• Took over management of the legacy application in 2014 and supervised the implementation of new features.
• Supervised a rewrite of the code-base to enable synergies with the company's other projects starting in 2016.
• Coordinated a team of designers and developers to launch new versions of the web and iOS applications in 2019.
• Designed and developed parts of the new user interface and a responsive newsletter template.
• Handled bug reporting, triage, and quality assurance while fixing front-end issues.
• Researched and supervised the implementation of services to improve the streaming quality and the video workflow.

• Tools & Tech:
• Figma
• Twig
• SCSS
• JavaScript
• Git
• GitLab
• Trello
• Email Octopus

ArteKino Festival

• Project Manager
• UX & UI Designer
• Front-End Developer

Launched in 2016 by Arte France Cinéma and Festival Scope, the ArteKino Festival is a yearly online film festival showcasing ten recent feature films, available to watch for 50,000 viewers living in the European Union.

At the end of each of the festival's editions, one film receives an audience award based on votes submitted online by audience members.

• Worked with the principal stakeholders to write the specifications of the first version of the application and additional features.
• Supervised the design and development teams in charge of creating the web, iOS, and Android applications.
• Designed and developed parts of the user interface and created functionnal prototypes to test user journeys and experience.
• Handled bug reporting, triage, and quality assurance.
• Trained junior project managers to supervise the project from the 2019 edition onwards.

• Tools & Tech:
• Figma
• HTML
• CSS
• JavaScript
• GitLab
• Trello
• Mailchimp

Festival Scope

• Project Manager
• UX & UI Designer

Festival Scope is a VOD platform showing selected titles from international film festivals, giving a worldwide audience the chance to attend these events virtually and affording extra visibility to films with limited distribution opportunities.

• Worked with the product owners to establish and write specifications for the platform.
• Supervised a team of designers and developers to deliver a first version of the web application in 2016 and to work on further iterations.
• Created wireframes and mock ups for a mobile application and supervised its development.
• Collaborated with the lead developer to research possible synergies with the company's other applications built on the same code-base.
• Designed and developed responsive newsletter templates and trained the staff members in charge of sending them.
• Handled bug reporting, triage, and quality assurance.

• Tools & Tech:
• Gimp
• Inkscape
• HTML
• CSS
• GitLab
• Trello
• Mailchimp

Vue JS Kanban

• Developer
• UX & UI Designer

A Trello-like Kanban board application with a drag & drop UI to sort lists and cards.

Developed following the test-driven development (TDD) process.

• Built a CRUD application to create, display, modify, and delete lists and cards.
• Used Vuex to manage state across the application and the Web Storage API to store the data.
• Wrote unit tests with the Jest testing suite following the TDD process.
• Set up client-side form validation and sanitization.
• Implemented a drag & drop UI using vanilla JS and the drag, dragover, and dragend events.

• Tools & Tech:
• Figma
• HTML
• SCSS
• JavaScript
• Vue.js
• Vuex
• Vuelidate
• DOMPurify
• Jest
• Git
• GitHub
• Netlify

Vanilla JS Memory

• Developer
• UX & UI Designer

A classic game of Memory in which a human and a computer player take turns to discover the highest number of pairs.

If either player discovers a pair, they get to play another turn. The game ends when all the pairs have been discovered.

• Implemented a turn based system to let either the human or computer play.
• Created a knowledge base so that the computer player could keep track of which cards had been revealed and which cards had been removed from play after a pair is discovered.
• Scripted a strategy for the computer player which would check revealed cards for matching pairs at the beginning of each turn and either flip those if a match was found or flip an unknown card and check again for a matching revealed card.
• Developed JS and CSS animations when flipping cards and when shuffling the cards for a new game.
• Used ES modules and SCSS to organize the code in smaller, more manageable files.

• Tools & Tech:
• Figma
• HTML
• SCSS
• JavaScript
• ES Modules
• Parcel
• Git
• GitHub
• Netlify

Vanilla JS Metronome

• Developer
• UX & UI Designer

A JavaScript metronome with accessible controls for the tempo, number of beats and to toggle the offbeat on or off.

The Web Audio API is used to produce metronome clicks at different frequencies to mark the first beat of a cycle, normal beats and offbeats.

• Used asynchronous functions and recursion to build the basic metronome logic, allowing the tempo to be updated without clearing an interval or restarting the metronome.
• Used JS prototypes to create oscillators with different frequencies which can be played and muted by using built-in methods.
• Built UI animations and accessible custom form inputs.

• Tools & Tech:
• HTML
• CSS
• JavaScript
• Git
• GitHub
• Netlify

Into the FrancoVerse

• Developer
• UX & UI Designer

A Vue.js data visualisation project exploring Jess Franco's colossal filmography.

My goal was to learn the basics of the Vue.js framework and SVG animation.

• Inspired by lobby card layout, and vintage book jackets and poster graphic design elements to capture the feel of Franco's best known films.
• Built a chart using SVG and JavaScript animations with data stored as a JavaScript object.
• Developed a filter system which updates the chart when new filter options are selected.
• Available options for each filter are updated depending on previously selected options to avoid returning no results.
• Plan to revisit and optimise the code now that I have a better understanding of JavaScript.
• Plan to improve the design for the list of films and add a map to chart recurring shooting locations, and possibly move the data to a server using GraphQL to load it on the client.

• Tools & Tech:
• Vue.js
• SCSS
• JavaScript
• HTML
• Git
• GitHub
• Netlify