Weeknotes #2

The beginning of the week started out differently to what I was expecting. I was meant to be spending the day with Si to discuss and chat through the roadmap and to set some goals for a redesign project. Unfortunately we had to reorganise the meeting for another time.

Instead of heading into the office, I worked at home and had various discussions with the team on a host of topics, design tokens, CSS variables, component styling in Angular as well as the work Jon has been doing with storybook.

I also watched a video from Front Conference by Garret Miller from Slacks design team on The Gradual Design System it provided some great insight and nice to see we’ve taken a similar approach.

WCAG 2.1 - Identify input purpose

It came to my attention this week that the forms builder doesn’t help our clients conform to the Level AA specifically around the 1.3.5 success criterion 1.3.5 Identify input purpose.

Essentially we need to set or provide a way for our clients to set the correct autocomplete intent of a form field. Speaking to one of the team we’ve come to a solution that should aid this process and allow our clients to be compliant.

Design systems slack

I came across a great community on Tuesday in the form of Design Systems Slack. What a gold mine of information and connections. I found myself loosing the morning reading some great insight into accessible components in the #topic-ally channel, I can see me visiting this community regularly as part of my week.

Native drag and drop in Firefox

Its always helpful to use a different browser to your developers. In testing some new drag and drop behaviour I came across an issue where its not possible to drag and drop buttons without using the and ALT drag keyboard modifier. We still need to get around this issue but shows that cross browser testing in essential in meeting the needs of different users, and today browsers still have inconsistencies.

User flow Figma components

Having recently started documenting the existing user journeys in the entry editor in Figma, I wanted to be able to start creating user flow diagrams to document and explain suggested app workflows to the team. I could have created these using Google drawings, but wanted to keep documentation in one place.

This lead to creating a series of flow arrows and states to be drawn on a simple frame grid in Figma. We can quickly create flow diagrams. I’m sure this will evolve over time.

Front end code

I don’t write much front end code these days, there are definitely more capable people than myself but I needed to make some minor changes to a couple of screens and adjust some app microcopy.

Multitenant UI

We’re at a stage in the lifecycle of the Contensis where the user interface should be part of the multi tenant world that we’re building. But breaking down an application that’s been built over 17 years is a challenge. We’re at that stage that we need to understand where to break the seams in a monolithic app and move the new parts of the application into the modern world.

Get my design on!

Friday was a good day, I spent the day with my headphones on, no interruptions and delved into Figma. I did a typographic audit to start looking into improving the applications typography. Worked on designing a new accessible toolbar and how we could introduce a canvas writing experience alongside our existing components.

The day flew by, more of that please!