JVH

👩🏼‍💻
Projects

Screenshot of Typeform right-to-left language support

Add support for right-to-left languages (2023)

At Typeform, I noticed that there were regular requests from customers for us to support Arabic and Hebrew and so during one of our hackathon weeks, I put together a POC to show how we could achieve this.

After presenting the POC, our team decided that we'd like to implement this work intro production. I scoped the work that would be needed to finalise the feature and created an RTL design rules document to use alongside the implementation.

I implemented the support by using logical CSS. I also created a cheat sheet for the developers to refer back to and made sure there was stylelint and visual regression tests in place to prevent regression.

Screenshot of Typeform Accessibility Checker

Accessibility checker (2020)

The accessbility checker started off as a hackathon project. As the owners of the Typeform form renderer, we quickly jumped on the opportunity to offer this feature in production. One of our goals was to help form creators to create better forms which includes accessbility.

After many discussions about what should be in the final product, I suggested the features that would bring the most immediate value for the customer all of which ended up in the final build.

The a11y checker checks the theme colors for color contrast, any images for alt text and shows the user which parts need updating.

Screenshot of Cards for Humanity

Cards for Humanity (2020)

Cards for Humanity is an inclusive design tool. It started as a set of physical cards that the Idean team created for workshops with clients and in 2020 I helped bring the cards online.

The site is built using create-react-app. My initial contribution was to help build the UI and fine tune the animations.

In the second phase I made the website into a Progressive Web App.

Screenshot of smarty.co.uk

SMARTY (2019-2021)

We continuously built new features for SMARTY customers based on user feedback. The site is built using a combination of Gatbsy for the marketing site and React with Ruby on Rails for the order and user account journeys.

When I joined the team I helped set up a better release process using git flow. I also took ownership of accessibility by introducting standards into the dev and QA process while also implementing numerous fixes based on an accessibility report.

Screenshot of photobox.com

Photobox (2018-2019)

The Friday team helped the Photobox in-house dev team to move their old website onto a new stack using React and GraphQL.

As part of my role I helped set up a grid system using CSS Grid. We used mixins so that it could easily be used by other teams across the business. I also helped set up font rules and branding in a way that it could easily be replaced with branding of the sister companies of the Photobox Group.

As we were working on a live site as part of the client's development team we continuously deployed features as soon as they were built and tested.

Screenshot of the Photobox editor

Photobox Editor (2018-2019)

Photobox's old photo editor was still running on Flash and with many browsers no longer supporting Flash it was time to update it to a more modern stack with React.

I joined the team during the last two months before handover so I had to quickly get up to speed with a complex code base.

I used my expertise from the main Photobox website to set up branding for the editor so that it could also be used for their sister companies. I also implemented a couple of new features like swapping images.