<?xml version="1.0" encoding="utf-8"?>
<feed xmlns="http://www.w3.org/2005/Atom">
  <title>Thoughts from Anthony Dillon</title>
  <subtitle>I love to learn and teach others, I&#39;m always looking for new ways to improve myself. I&#39;m a big fan of the leanweb community.</subtitle>
  <link href="https://anthonydillon.com/feed.xml" rel="self"/>
  <link href="https://anthonydillon.com/"/>
  <updated>2025-10-08T11:27:52Z</updated>
  <id>https://anthonydillon.com/</id>
  <author>
    <name>Anthony Dillon</name>
    <email>me@anthonydillon.com</email>
  </author>
  
  <entry>
    <title>Ant FM</title>
    <link href="https://anthonydillon.com/ant-fm/"/>
    <updated>2025-10-08T11:27:43Z</updated>
    <id>https://anthonydillon.com/ant-fm/</id>
    <content type="html">&lt;p&gt;The idea for Ant.FM came from me switching from listening to music on the free Spotify (with ads) to listening to music on Youtube. Youtube provides most music ad free, but requires me to re-visit the web page to select the next track.&lt;/p&gt;
&lt;p&gt;I wanted to build a site that can queue up youtube video’s and play them one after another. Whether it is the full album, top tracks from an artist or a playlist the user has created.&lt;/p&gt;
</content>
  </entry>
  
  <entry>
    <title>Fostering a culture of gratitude</title>
    <link href="https://anthonydillon.com/fostering-a-culture-of-gratitude/"/>
    <updated>2025-10-08T11:27:43Z</updated>
    <id>https://anthonydillon.com/fostering-a-culture-of-gratitude/</id>
    <content type="html">&lt;p&gt;Over the past two decades, there has been growing evidence that gratitude is not only good for team morale but has positive benefits mentally and physically for the person delivering the subjective self-assessment.&lt;/p&gt;
&lt;p&gt;Saying “thank you” reminds us that we would not be where we are without the effort of others. People tend to focus on the barriers they face, but by fostering a cognitively aware team they will also be mindful of the the benefits they receive. This ultimately results in greater feeling of positive emotions such as happiness and optimism. I think we can all agree that a happy team is more productive across the board, especially in creative jobs.&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;“practising gratitude magnifies positive feelings more than it reduces negative feelings”&lt;/p&gt;
&lt;/blockquote&gt;
&lt;p&gt;&lt;em&gt;by Robert Emmons in The Gratitude Project: How the Science of Thankfulness Can Rewire Our Brains for Resilience, Optimism, and the Greater Good.&lt;/em&gt;&lt;/p&gt;
&lt;p&gt;Research released in the last decade has shown that people with a greater habit of gratitude have fewer common health issues, such as headaches, digestion issues, colds, etc. A series of studies involving MTurk workers at the University of Limerick revealed that being grateful tended to increase the sense of meaning in life and reduce feelings of boredom.&lt;/p&gt;
&lt;h2&gt;Actionable things you could try at work&lt;/h2&gt;
&lt;p&gt;I would like to provide some real examples of things I have tried. Some have come and gone but all have brought positives.&lt;/p&gt;
&lt;h3&gt;&lt;strong&gt;Keep a gratitude journal&lt;/strong&gt;&lt;/h3&gt;
&lt;p&gt;Write down three things on a daily basis that you are grateful for to help raise your personal affirmation of gratitude. This can help you to wake up with an awareness of the goodness around you and also draw your attention to the gifts you receive from others.&lt;/p&gt;
&lt;h3&gt;Include appreciation and recognition in team meetings&lt;/h3&gt;
&lt;p&gt;In my team meetings I ensure we include time to pause and reflect on the things we have appreciated from around the team. We move at a rapid place and can forget to gift a colleague with a thank you. It’s important to provide a place to revisit and explain the action which warranted the appreciation.&lt;/p&gt;
&lt;h3&gt;Call for private direct message appreciation&lt;/h3&gt;
&lt;p&gt;I used to ask the team in our town hall to spend five minutes thinking of something they appreciated from somebody else over the last month, and to send a direct message of appreciation to that person. Some people do not relish public signs of appreciation and so this lowers the barrier for everyone: the giver and the recipient.&lt;/p&gt;
&lt;h3&gt;Lead by example&lt;/h3&gt;
&lt;p&gt;If someone does something you appreciated, big or small, ensure you take a moment to acknowledge the person’s actions. I know you are busy but it only takes a moment and the knock-on effect will justify the time spent tenfold.&lt;/p&gt;
&lt;h2&gt;In conclusion&lt;/h2&gt;
&lt;p&gt;Ultimately, as a leader (or potential leader) it is your duty to provide a culture of safety, productivity and happiness to your team. Taking steps to ensure happiness is crucial to the success of your teams and projects.&lt;/p&gt;
&lt;p&gt;Take gratitude seriously. It is not a given that it&#39;s part of your work culture, and it may need to be consciously fostered. Be mindful of the different personalities within the team and find ways to provide safe appreciation without causing anxiety.&lt;/p&gt;
&lt;p&gt;Most importantly, thank everyone - from your CEO for a pay rise, to someone that went out of their way to report an issue within a project. Don’t just say “thanks, ….”. Take the 5 seconds to make your gratitude genuine and therefore make it stand out to the receiver.&lt;/p&gt;
</content>
  </entry>
  
  <entry>
    <title>Handling “class” attribute in Beautifulsoup</title>
    <link href="https://anthonydillon.com/handling-class-attribute-in-beautifulsoup/"/>
    <updated>2025-10-08T11:27:43Z</updated>
    <id>https://anthonydillon.com/handling-class-attribute-in-beautifulsoup/</id>
    <content type="html">&lt;p&gt;Using the docs it can be difficult to spot the syntax to find an element with a class. Here is how you refine your search to the elements with my-image class.&lt;/p&gt;
&lt;pre&gt;&lt;code&gt;img = soup.findAll(&amp;quot;img&amp;quot;, { &amp;quot;class&amp;quot; : &amp;quot;my-image&amp;quot; })
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;Further reading:&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href=&quot;http://www.crummy.com/software/BeautifulSoup/bs4/doc/&quot;&gt;Beautiful Soup Documentation&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
</content>
  </entry>
  
  <entry>
    <title>Leading distributed teams</title>
    <link href="https://anthonydillon.com/leading-distributed-teams/"/>
    <updated>2025-10-08T11:27:43Z</updated>
    <id>https://anthonydillon.com/leading-distributed-teams/</id>
    <content type="html">&lt;p&gt;Hi my name is &lt;strong&gt;Ant&lt;/strong&gt; and I have work at Canonical the company behind Ubuntu for over 10 years now. All of which I worked in the office. For the last 7 years I have been a manager of a mix of in office-based and remote team members.&lt;/p&gt;
&lt;h2&gt;Unexpected challenge over the last 12 months&lt;/h2&gt;
&lt;p&gt;We used to hold company get together called Sprints within Canonical. In which, a large portion of the wider company would all get together for a week of meetings, planning and socialising. Over the past year and a bit we have not been able to do this and has led to a weaker cross team relationship.&lt;/p&gt;
&lt;p&gt;The last few Sprint weeks have been held remotely which does not allow for hallway discussions and organic team building and idea sharing/forming over coffee or dinner.&lt;/p&gt;
&lt;p&gt;For example, in the last Sprint we were talking about a technical challenge which lead me to think of how that could positively effect another project. I would normally wait to the end of the meeting and catch the person working on the other project on the way out and explain the idea as we grabbed coffee before the next meeting. In this case, we both just closed our call and left it there.&lt;/p&gt;
&lt;h2&gt;How do you keep remote and distributed teams in the loop and prevent the feeling that people are siloed and isolated?&lt;/h2&gt;
&lt;p&gt;A lot of us will say Good morning in the team chat channel when we come on board. This gives people a feeling of light touch with others is not straight into work.&lt;/p&gt;
&lt;p&gt;We hold regular cross team meetings such as guild or chapter meetings which keep teams from only talking to their immediate squad.&lt;/p&gt;
&lt;h3&gt;Tools we use&lt;/h3&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;Miro&lt;/strong&gt;: for brainstorming and sharing our ideas collaboratively&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Figma&lt;/strong&gt;: for creating and archiving designs&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Zeplin&lt;/strong&gt;: for presenting finalised versions of designs for comments and feedback&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;ZenHub&lt;/strong&gt;: an augmentation of GitHub which provides a view of issues and PRs as a board which auto updates based on the status on GitHub.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Mattermost&lt;/strong&gt;: as our internal chat system&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;We have an internal team optional meeting were someone can put forward a session based on a topic they would like to share with everyone. These are called &lt;strong&gt;Masterclass&lt;/strong&gt; and they allow for the entire team to get together and learn and questions each other across disciplines.&lt;/p&gt;
&lt;h3&gt;What creates a productivity and collaboration in a remote environment&lt;/h3&gt;
&lt;p&gt;Canonical has always been a truly global company. The teams here have been trail blaze async working processes. We developed Launchpad which is a software collaboration platform before GitHub or GitLab.&lt;/p&gt;
&lt;p&gt;All teams across Canonical and the industry are different and should adapt others processes to suit there teams. The web team at Canonical is also always evolving its process but I will detail some of the structures, processes and cultural changes we have utilised over the past 12 months.&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;Shared meetings notes&lt;/strong&gt;: we encourage all meetings to have someone taking notes of the meeting and posting them as an issue on a private GitHub repo we have all subscribed to. That way we receive a nicely formatted email when a meeting has finished and allows for searching, tagging and continued discussion. We assign the issue to anyone that has an action from the meeting and so appears on there assigned issue list. Which is a nice way to tie meeting actions with our standard working practise.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Record team meetings&lt;/strong&gt;: we perform a number of rituals as a team. Such as end of iteration demos and a fun meeting at the end of each week which a number of us present something they are interested in. These meetings are recorded and shared with the team so all team members can watch the sessions and its not just a summary of the fun the team had.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Reviews are async&lt;/strong&gt;: as stated above in tools we use Zeplin as our tool for performing design reviews which can happen at any time by adding comments to the design.&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;These tips and processes do not just benefit teams with people in different time zones.&lt;/p&gt;
&lt;p&gt;This also is a huge benefit to members of the team that are more reserved and less likely to talk up in a group meeting. I appropriate the time to think though my ideas and gather my thoughts before putting forward my opinion on something. How often has a decision been made in a meeting and only later turns out the decision would have been different with more thought or discussion.&lt;/p&gt;
&lt;p&gt;Also, everyone has holiday, can be sick or are just busy. These processes allows for these members of the team to miss meetings in the knowledge they can catch up later and add any opinions they have without missing out and being left out.&lt;/p&gt;
&lt;h2&gt;What do you look for in the hiring process to determine if engineers will succeed with remote work?&lt;/h2&gt;
&lt;p&gt;It is not on an individual to succeed or fail when working remotely. It is a team effort and if someone is having trouble then it should be noticed or they need to feel safe enough to speak up on the matter. A truly good team will react positively to any troubles a team member is having. Finding ways to remedy to issues and adapt the working processes.&lt;/p&gt;
&lt;p&gt;There are of course exceptions but that is where the manager need to support the team member.&lt;/p&gt;
&lt;p&gt;We have developed an on boarding epic which contains a number of categorised issues with list of todos and things to read. We normally give a new member of the team two weeks to step through the items and encourage them to take there time. It’s inevitably overwhelming and the best thing we can do is remove any time pressure a person might feel.&lt;/p&gt;
&lt;h2&gt;How do you introduce remote teammates into the organisation so they have a strong chance of being successful?&lt;/h2&gt;
&lt;p&gt;We assign a new member of the team a mentor. A mentor is generally a person that has been in the team for a while and can act as an unblocker and someone that will explain things in familiar terms.&lt;/p&gt;
&lt;p&gt;One aspect of the on boarding process is to arrange and have welcome meetings with members of the team that they should know and likely to interact with. This reduces to pressure when communicating about work later on.&lt;/p&gt;
&lt;h2&gt;How do effective engineering managers build trust – and support individual engineers, teams, and organisations?&lt;/h2&gt;
&lt;p&gt;You need to allow them autonomy on the project and work they work on. No one wants projects to all move in different directions but that needs to be controlled by a strong team culture which emanates from the engineering manager.&lt;/p&gt;
&lt;p&gt;For managers, 121s with reports are the most important meeting of the week. Try as hard as you can to never cancel or reschedule them. It may feel like another of many meetings for you but for the report it is likely one of there few meetings in the week and will likely be very important for them. I generally start 121s by talking candidly about life and how things are going. It’s important to build an honest friendship and rapport with them so your team member feels comfortable coming to you with any issue they may have.&lt;/p&gt;
&lt;h2&gt;Let’s round up by sharing one key takeaway on leading distributed teams, What’s your one piece of advice to any engineering leader?&lt;/h2&gt;
&lt;p&gt;Stay close to the code. It might be difficult as you may find you are no longer the expert in the room on something but you build a lot of respect and good culture by trying anything, asking simple questions and allowing the team to help you.&lt;/p&gt;
&lt;p&gt;As a avid football player, I treat work like a game of sport. You may be the captain but that means you work as hard, keep your humility. Provide &lt;a href=&quot;https://en.wikipedia.org/wiki/Servant_leadership&quot;&gt;Servant leadership&lt;/a&gt; from the front.&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;Don&#39;t put yourself above others in your mind, stay connected, stay friendly.&lt;/p&gt;
&lt;p&gt;&lt;em&gt;Robin Winslow&lt;/em&gt;&lt;/p&gt;
&lt;/blockquote&gt;
</content>
  </entry>
  
  <entry>
    <title>Principle of estimating tasks</title>
    <link href="https://anthonydillon.com/principle-of-estimating-tasks/"/>
    <updated>2025-10-08T11:27:43Z</updated>
    <id>https://anthonydillon.com/principle-of-estimating-tasks/</id>
    <content type="html">&lt;p&gt;Once a specification of a new feature has been designed and agreed. This work needs to be broken down into small pieces. A practise I describe in &lt;a href=&quot;https://anthonydillon.com/writing-specification-documents&quot;&gt;my post about specification documents&lt;/a&gt;.&lt;/p&gt;
&lt;p&gt;Once the tasks are broken down and listed is time to estimate these tasks. The temptation here is to estimate by time. For example, this should take me two days. Therefore, two points? Or it might take a week, is that 1 week point or 5?&lt;/p&gt;
&lt;p&gt;Sounds reasonable once you agree a unit of time, right? Now imagine you have a task that you have not done before. Therefore, needs investigation, research and maybe a spike. How do you estimate something you don&#39;t know? This is where time based estimation falls over.&lt;/p&gt;
&lt;p&gt;Estimating based on complexities and unknowns is a much better method of estimating tasks. For example, if you have never done it before then it&#39;s a high estimation. Let&#39;s say 8 points. Now you could get lucky and everything just falls into place in a day or two but that is likely to be rare and will even out over the course of months of projects.&lt;/p&gt;
&lt;p&gt;Another interesting factor to consider are tasks that have dependencies on external teams. This often causes “more work” then you think when thinking in time. There will be communication, reviews and round of feedback which you are likely to forget when estimating tasks like this.&lt;/p&gt;
&lt;p&gt;Here is a quick guide I wrote for my team. In which, I use the Fibonacci sequence provide the integer&#39;s.&lt;/p&gt;
&lt;h2&gt;1 point&lt;/h2&gt;
&lt;p&gt;The smallest unit of work. A task that has been done many times and is not dependent on any other people. No review is required.&lt;/p&gt;
&lt;h2&gt;2 points&lt;/h2&gt;
&lt;p&gt;A task that is fully known and has been done before. May require a review before being complete.&lt;/p&gt;
&lt;h2&gt;3 points&lt;/h2&gt;
&lt;p&gt;A task that has multiple factors. There are no unknowns but will require a review which may result in back and forth.&lt;/p&gt;
&lt;h2&gt;5 points&lt;/h2&gt;
&lt;p&gt;A large task which you feel comfortable completing. This may be something you have not done before but is not very complex.&lt;/p&gt;
&lt;h2&gt;8 points&lt;/h2&gt;
&lt;p&gt;A task that has external dependencies or multiple people. May require you to research an aspect of this task.&lt;/p&gt;
&lt;h2&gt;13 points&lt;/h2&gt;
&lt;p&gt;A complex task that you have not done before and has external dependencies. This task may require pairing with another person.&lt;/p&gt;
&lt;h2&gt;21 point&lt;/h2&gt;
&lt;p&gt;You’re doing this wrong. You should consider splitting this task into smaller tasks. If you cannot split this then this task should be completely unknown.&lt;/p&gt;
&lt;p&gt;Remember, the point of estimations is to derive a velocity in which you can rely on to confidently commit to work over short periods of time.&lt;/p&gt;
&lt;p&gt;Estimates don’t need to be accurate, they need to be consistent. Your velocity over time corrects for inaccuracy of our estimates.&lt;/p&gt;
</content>
  </entry>
  
  <entry>
    <title>Quick thanks</title>
    <link href="https://anthonydillon.com/quick-thanks/"/>
    <updated>2025-10-08T11:27:43Z</updated>
    <id>https://anthonydillon.com/quick-thanks/</id>
    <content type="html">&lt;p&gt;Modern appreciation systems in workplaces normally involve an application for someone including written justification. This reduces the chance of someone being appreciated when it becomes time to submit the form.&lt;/p&gt;
&lt;h2&gt;If the appreciation is rejected?&lt;/h2&gt;
&lt;p&gt;As this system is gated by applications then some will be rejected and would demoralise the person applying could lead to them becoming less likely to continue submit appreciation.&lt;/p&gt;
&lt;p&gt;Even worse, the person could tell the other that they have submitted the form and if it is rejected this would make the person feel unappreciated.&lt;/p&gt;
&lt;h2&gt;How can we tackle this?&lt;/h2&gt;
&lt;p&gt;The application of appreciation is a necessary system within an organisation but there is a benefit of micro appreciation. Now that we are all working remotely. We could add define a tag or a way to mark in a conversation that you appreciate them. For example, maybe replying to a message with &lt;strong&gt;@appreciation++&lt;/strong&gt; or simply adding a 👍 (thumbs up emoji) to a message would mark it as a micro appreciation. This would be recorded and high counts would be automatically applied to the rewards system as a way to aggregate appreciation on a monthly basis.&lt;/p&gt;
&lt;p&gt;A monthly report could be designed to summarise your interactions and micro appreciations. This would give the system immediate value to the happiness of the individuals in the company.&lt;/p&gt;
&lt;h2&gt;How can we avoid gamification?&lt;/h2&gt;
&lt;p&gt;I do not like to solve an issue until it appears. So I would suggest we trust people to be honest. If it becomes clear there is a problem here then try and solve it then.&lt;/p&gt;
&lt;p&gt;Produce a monthly email of small appreciation. Making this a in purely a reflective service.&lt;/p&gt;
</content>
  </entry>
  
  <entry>
    <title>Red Bull - Tech to track</title>
    <link href="https://anthonydillon.com/red-bull-tech-to-track/"/>
    <updated>2025-10-08T11:27:43Z</updated>
    <id>https://anthonydillon.com/red-bull-tech-to-track/</id>
    <content type="html">&lt;p&gt;It was a pleasure to attend the Red Bull: Tech to Track event in Milton Keynes. This event showcased some of the remarkable engineering which is undertaken in Milton Keynes Red Bull factories. The team is constructed of ~1400 people making F1 the largest team sport in the world. The level of attention to detail in a cutting edge field is inspiring to witness.&lt;/p&gt;
&lt;p&gt;As an Engineering Director, I am often looking for inspiration on process improvements which would benefit the Engineering teams at Canonical. I wanted to share some thoughts I had from the interesting talks given at the event.&lt;/p&gt;
&lt;h2&gt;Setting the direction&lt;/h2&gt;
&lt;p&gt;The speed of a business can strongly influence the culture of an organisation. The time from idea to testing to roll out should be measured and monitored to ensure delivery does not decline as the technology landscape expands. I plan to monitor the time to deliver inspiration as a key metric for my teams going forward. Productively often declines slowly overtime with process overheads. Therefore, it is key for all Engineering teams to pragmatically challenge standardised procedures and practices to achieve objectives and meet deadlines.&lt;/p&gt;
&lt;h2&gt;Synergy better construction team and racing team&lt;/h2&gt;
&lt;p&gt;In the Web Engineering team at Canonical, we use a lot of our own in-house developed products such as &lt;a href=&quot;https://github.com/canonical/rockcraft&quot;&gt;rockcraft&lt;/a&gt;, &lt;a href=&quot;https://charmhub.io/&quot;&gt;Charms&lt;/a&gt;, &lt;a href=&quot;https://juju.is/&quot;&gt;Juju&lt;/a&gt; and &lt;a href=&quot;https://ubuntu.com/kubernetes/charmed-k8s&quot;&gt;Charmed K8s&lt;/a&gt;. This has become a source of excitement for us. By working closely with other teams in the organisation, we help to drive each other&#39;s roadmaps and provide consistent feedback. This was very similar to the synergy between the construction teams in Red Bull and their driver teams.&lt;/p&gt;
&lt;p&gt;In F1 feedback is collected very quickly after each session, often before the car stops. After a test session both teams jump straight into a meeting room and conduct a though debrief on all aspects of the experience and issues detected. This is performed quickly as every minute after the session the feedback can be lost. This is something I plan to introduce to my Engineering teams. Firstly, by conducting internal Web Engineering user testing session when we meet for sprints in the coming weeks.&lt;/p&gt;
&lt;h2&gt;Talent Academy&lt;/h2&gt;
&lt;p&gt;At Red Bull racing that have a keen focus on attracting young people to STEM. Ultimately finding and retaining true talent via a series or educational programmes. Firstly, they showcased the amazing work they are doing with schools in the area via their &lt;a href=&quot;https://stemx.co.uk/&quot;&gt;STEMx programme&lt;/a&gt;. Which encourages young people to grow their interest in STEM fields. This is achieved by visiting schools with a team of educators. Encouraging them to take part in competitive team work. They offer work experience for 15-year-olds and older to work with experienced engineers. Often returning summer after summer.&lt;/p&gt;
&lt;p&gt;The area which struck me as interesting was the graduate programme which encourages a set of successful postgraduate students to work together in a think tank structure. Allowing them to shine and become the next generation of talented young people at Red Bull. This would be an interesting programme to adopt at Canonical.&lt;/p&gt;
&lt;p&gt;All in all, it was nice to see this level of Engineering displayed so proudly and an honest focus on benefiting the local community.&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;https://anthonydillon.com/img/tech-to-track.jpg&quot; alt=&quot;Red Bull race cars in front of screens&quot; /&gt;&lt;/p&gt;
</content>
  </entry>
  
  <entry>
    <title>Refocusing on 1:1s</title>
    <link href="https://anthonydillon.com/refocusing-on-1-1/"/>
    <updated>2025-10-08T11:27:43Z</updated>
    <id>https://anthonydillon.com/refocusing-on-1-1/</id>
    <content type="html">&lt;p&gt;I have been grappling with the desire to improve my 1:1 meetings recently. As a manager, I want 1:1 meetings to focus on the needs of my reports and not be a status or progress report of their current work. But I don&#39;t want to burden anyone with preparing an agenda and no-agenda meeting can cause anxiety. So here are some areas I will try and touch on each week.&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;Wellness&lt;/strong&gt;: Are you safe and well? You needn’t disclose personal information, but I’m here to listen, especially if work is impacting your well-being. Do you feel physically and psychologically safe, is your work/life balance compatible with your mental health?&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Readiness&lt;/strong&gt;: Are you set up to succeed? Do you have what you need to meet your goals, starting with a clear understanding of what those are? What resources (material, support, or even just help and advice) might I provide that could help you be successful?&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Obstacles&lt;/strong&gt;: What is standing in your way? One of my primary roles as your manager is to help identify and clear obstacles to your progress. Let’s talk about anything that is slowing you down or anything that could speed you up.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Recognition&lt;/strong&gt;: Since we last met, what did you accomplish that you feel good about? No achievement is too small. It&#39;s silly to scramble for a list at the end of the year. Let’s note each achievement, while they&#39;re fresh in our minds.&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Feedback&lt;/strong&gt;: How I am doing as your manager? I promise to always to open and honest with you and I hope you can do the same for me. I would like to hear what I can do better and differently to become a better manager.&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;I am also working out how to bridge the gap between being productive and casual within 1:1&#39;s. I don&#39;t want to lose the general chit chat aspect of this calls as a good report with your reports is very important.&lt;/p&gt;
</content>
  </entry>
  
  <entry>
    <title>Surprising CSS selectors you can use today</title>
    <link href="https://anthonydillon.com/surprising-css-selectors-you-can-use-today/"/>
    <updated>2025-10-08T11:27:43Z</updated>
    <id>https://anthonydillon.com/surprising-css-selectors-you-can-use-today/</id>
    <content type="html">&lt;p&gt;As of date of writing which was 2016.&lt;/p&gt;
&lt;p&gt;While working on the Juju GUI project, I was reviewing a pull request when I spotted there were no prefixes on box-sizing. I thought I should check if they needed it before asking the requester to add them. In doing so I was surprised to find that there are a lot more CSS features with global support than I originally thought. So I trawled through the chasms of Can I use and have come out with some gems to share.&lt;/p&gt;
&lt;h2&gt;filter: sepia(1); – 78% browser support&lt;/h2&gt;
&lt;p&gt;CSS filter effects can be used to apply effects like blur, grayscale, brightness, contrast and hue. I remember a few years ago I was asked to create a blur effect as an element that overlays the page content. CSS was no help as none of the browsers supported blur. So I went on a dirty hacking weekend where I set the text to transparent, added a text shadow and used JavaScript to replace all the images with a blurred version. This worked, but I needed a shower afterwards.&lt;/p&gt;
&lt;p&gt;I was shocked to spot that today browser support is 78%, including full support for all browsers apart from Edge, IE and Opera Mini. So I could have just used the following:&lt;/p&gt;
&lt;pre&gt;&lt;code class=&quot;language-css&quot;&gt;img {
  transition: -webkit-filter .5s;
  -webkit-filter: blur(0);
}

.overlay-active img {
  -webkit-filter: blur(1);
}
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;So while this doesn’t cover all bases; it’s enough to let us drop the dirty hacks and use progressive enhancement instead. After all, it’s not the end of the world if IE users see a simple alpha transparent overlay instead of a blurred version.&lt;/p&gt;
&lt;p&gt;See &lt;a href=&quot;http://caniuse.com/#feat=css-filters&quot;&gt;http://caniuse.com/#feat=css-filters&lt;/a&gt; (WebKit prefix)&lt;/p&gt;
&lt;h2&gt;CSS3 selectors – 97.73% browser support&lt;/h2&gt;
&lt;p&gt;CSS3 selectors dawned a new era of capabilities in CSS, giving us a bunch of new methods to select with logic. The more interesting selectors are explained below.&lt;/p&gt;
&lt;p&gt;&lt;code&gt;[foo^=&amp;quot;bar&amp;quot;]&lt;/code&gt;, the carat symbol is used as a regular expression to select attributes starting with &lt;code&gt;bar&lt;/code&gt; in this case. A simple example of this features usage is:&lt;/p&gt;
&lt;pre&gt;&lt;code class=&quot;language-css&quot;&gt;a[href^=&amp;quot;http&amp;quot;] {
   background: url(external-icon.svg) no-repeat;
   padding-left: 10px;
}
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;Here we are selecting all the links that link to an external site and adding a small external icon to it automatically.&lt;/p&gt;
&lt;p&gt;&lt;code&gt;[foo$=&amp;quot;bar&amp;quot;]&lt;/code&gt;, similarly this regular expression symbol refers to matching end of string.&lt;/p&gt;
&lt;pre&gt;&lt;code class=&quot;language-css&quot;&gt;a[href$=&amp;quot;.pdf&amp;quot;]:after {
  content: “(PDF)&amp;quot;;
}
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;This example demonstrates selecting a link that is linking to a PDF file and appending a notice to give the use an understanding of the expected behaviour.&lt;/p&gt;
&lt;pre&gt;&lt;code class=&quot;language-css&quot;&gt;:nth-child()
, selects elements based on the occurrence of the elements. For example:

li:nth-child(n2) {
  background-color: light-grey;
}
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;This example will select the every second element and apply a light grey background to it. You can also use (odd) in this case but I wanted to show the nth usage.
&lt;code&gt;:empty&lt;/code&gt;, This selector will select any element that containing nothing including HTML comments.&lt;/p&gt;
&lt;p&gt;Will match:&lt;/p&gt;
&lt;pre&gt;&lt;code class=&quot;language-html&quot;&gt;&amp;lt;div&amp;gt;&amp;lt;/div&amp;gt;
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;Won’t match:&lt;/p&gt;
&lt;pre&gt;&lt;code class=&quot;language-html&quot;&gt;&amp;lt;div&amp;gt; &amp;lt;/div&amp;gt;
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;The &lt;code&gt;:empty&lt;/code&gt; pseudo selector is useful for hiding empty elements that can cause spacing as they have padding. It can also hide the border of an empty list item. &lt;code&gt;:not()&lt;/code&gt;, is a negative selector. It takes an element selector as a parameter. If the match is false then styles are applied.&lt;/p&gt;
&lt;pre&gt;&lt;code class=&quot;language-css&quot;&gt;.menu:not(.is-hidden) {
  // menu styles
}
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;&lt;code&gt;foo ~ bar&lt;/code&gt;, is a sibling combinator. Which works similarly to &lt;code&gt;foo + bar&lt;/code&gt; but is less strict. The + method will only select the first bar inside foo. Whereas the ~ select will select all bars only if it is preceded by a foo.&lt;/p&gt;
&lt;pre&gt;&lt;code class=&quot;language-css&quot;&gt;h2 ~ p {
  margin-top: 1em;
}
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;You may have been under the impression, as I was, that these selectors were not well supported. Perhaps you thought either that you could not use them, or would require some thought into a polyfill or progressive enhancement trick to use them. However, I was surprised to discover that CSS3 selectors have 97.73% global support, including IE8 and up.&lt;/p&gt;
&lt;p&gt;See &lt;a href=&quot;http://caniuse.com/#feat=css-sel3&quot;&gt;http://caniuse.com/#feat=css-sel3&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;Calc() – 80.75% browser support&lt;/h2&gt;
&lt;p&gt;This is one of my favourite new features to CSS. &lt;code&gt;Calc()&lt;/code&gt; gives users the ability to perform mathematical calculations using different units within CSS. For example, positioning a background icon to the right of a input field.&lt;/p&gt;
&lt;p&gt;We have all been there, you add a background and position the icon to &lt;code&gt;right center&lt;/code&gt;. Dust your hands, job done. You show the design and they ask for the icon to be 10px from the right of the element. Damn, its a background and you don’t want to create a new element just for a little icon. So you set the background position to &lt;code&gt;90% center&lt;/code&gt;. This falls over at different viewport sizes. Calc to the rescue!&lt;/p&gt;
&lt;pre&gt;&lt;code class=&quot;language-css&quot;&gt;.search-field {
  background-position: calc(100% - 10px) center;
  …
}
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;That will do nicely. Also if you wanted a floating sidebar to fill up the entire height of the screen, apart from the header, you could use:&lt;/p&gt;
&lt;pre&gt;&lt;code class=&quot;language-css&quot;&gt;.sidebar {
  height: calc(100% - 50px)
}
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;With a nice healthy 80.75% global support and no browser prefixes required, it’s time to add this to your arsenal of selectors.&lt;/p&gt;
&lt;p&gt;See &lt;a href=&quot;http://caniuse.com/#feat=calc&quot;&gt;http://caniuse.com/#feat=calc&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;CSS animation – 90.29% browser support&lt;/h2&gt;
&lt;p&gt;Ever since the death of Flash we have been looking for a replacement to animation on the web, luckily CSS animations became available very quickly after. As with all new features I was curious, but resistant to use in production without carefully considering an appropriate fallback.&lt;/p&gt;
&lt;p&gt;These days, CSS animations boast a healthy 90.29% support with a &lt;code&gt;-webkit&lt;/code&gt; prefix. This means there is no reason not to add some small usability aids to your UI components, such as animating a notification into view to grab the user’s attention.&lt;/p&gt;
&lt;p&gt;If you want to bring your site or web app to life by adding some subtle animation. You could add some motion to the introduction of the notification, using the following simple example.&lt;/p&gt;
&lt;pre&gt;&lt;code class=&quot;language-css&quot;&gt;.notification-open {
  -webkit-animation: dropDown .6s;
  -webkit-animation-fill-mode: forwards;
  -webkit-animation-timing-function: ease-in-out;
  animation: dropDown .6s;
  animation-fill-mode: forwards;
  animation-timing-function: ease-in-out;
}

@-webkit-keyframes dropDown {
  from {-webkit-transform: translate(0,-100px);}
  to {-webkit-transform: translate(0,25px);}
}

@keyframes dropDown {
  from {-webkit-transform: translate(0,-100px);}
  to {-webkit-transform: translate(0,25px);}
}
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;&lt;strong&gt;Pro tip&lt;/strong&gt;: Do not animate a positional style such as &lt;code&gt;top&lt;/code&gt; and &lt;code&gt;margin&lt;/code&gt;. This will cause a page repaint and in some cases require the browser to calculate the positions of the visible elements on the page.&lt;/p&gt;
&lt;p&gt;See &lt;a href=&quot;http://caniuse.com/#feat=css-animation&quot;&gt;http://caniuse.com/#feat=css-animation&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;@supports rule – 67.85% browser support&lt;/h2&gt;
&lt;p&gt;&lt;code&gt;@supports&lt;/code&gt; gives us the ability to check if a feature is supported and conditionally style elements based on the browser’s functionality. For example, you can use supports to detect if flexbox is supported by that particular browser and if not swap back to floats.&lt;/p&gt;
&lt;pre&gt;&lt;code class=&quot;language-css&quot;&gt;@supports (display: flex) {
  div { display: flex; }
}

@supports not (display: flex) {
  div { float: left; }
}
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;Pairing &lt;code&gt;@supports&lt;/code&gt; with the not keyword allows for any type of logic within your CSS.&lt;/p&gt;
&lt;p&gt;One of the gotchas with this feature is most of the time we want to test an older browser for new feature support. The older browser itself will not support this type of query.&lt;/p&gt;
&lt;p&gt;At the moment feature queries have 67.85% support. While this is not ideal, it does cover the latest versions of the evergreen browsers, which is a good start. The only browsers lacking support are IE and Opera Mini. This has the added benefit of meaning we can begin to drop the extra dependence on Modernizr.&lt;/p&gt;
&lt;p&gt;See &lt;a href=&quot;http://caniuse.com/#feat=css-featurequeries&quot;&gt;http://caniuse.com/#feat=css-featurequeries&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;Flexbox – 95.4% browser support&lt;/h2&gt;
&lt;p&gt;This is one feature I’ve heard nothing about. Only joking! It’s talked about in hundreds of blog posts and conferences. It’s a fantastic tool to position elements either stacked horizontally or vertically, giving us the ability to easily centre elements or make elements all the same height. It also allows us to change the order in which the elements are displayed on the page. Have you ever been asked to swap the order of the image and text of a section when on small screen. I have — flexbox to the rescue.&lt;/p&gt;
&lt;pre&gt;&lt;code class=&quot;language-css&quot;&gt;@media only min-width(768px) {
  .row {
    display: flex;
    flex-direction: column-reverse;
  }
}
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;That said, I was a little wary of using it for anything important because, like all of these things, I didn’t believe its support was good enough. Flexbox proudly boasts a huge 95.4% browser support, spanning all the latest browsers, including Opera Mini. IE9 and below will miss out but when using it for aesthetics, that’s probably ok.&lt;/p&gt;
&lt;p&gt;See &lt;a href=&quot;http://caniuse.com/#feat=flexbox&quot;&gt;http://caniuse.com/#feat=flexbox&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;3D transforms – 89.87% browser support&lt;/h2&gt;
&lt;p&gt;This feature allows us to position an element in the third dimension. This feature also includes the perspective property, allowing us to set the z-index of a 3D element.&lt;/p&gt;
&lt;p&gt;We’ve all seen awesome examples of 3D scenes using just CSS, but the level of browser support took me by surprise. With an impressive 89.87% global support with a single prefix of webkit, it is ready to be used today in production. I would suggest dropping the fallback, as in most cases the functionality of a 3D element will be aesthetic.&lt;/p&gt;
&lt;p&gt;A quick example of a card that would spin and flip as you hover over it.&lt;/p&gt;
&lt;pre&gt;&lt;code class=&quot;language-css&quot;&gt;.card {
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform: rotateX(0deg) rotateY(0deg);
  transform: rotateX(0deg) rotateY(0deg);
  transition: transform 1s;
}

.card:hover {
  -webkit-transform: rotateX(180deg) rotateY(180deg);
  transform: rotateX(180deg) rotateY(180deg);
}
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;See &lt;a href=&quot;http://caniuse.com/#feat=transforms3d&quot;&gt;http://caniuse.com/#feat=transforms3d&lt;/a&gt;&lt;/p&gt;
&lt;h2&gt;In conclusion&lt;/h2&gt;
&lt;p&gt;I read a lot of blog posts and listen to a lot of podcasts all about frontend web development but did not realise how important it was to read through the features documented on Can I use. Truly, hats off to the people working on the site.&lt;/p&gt;
&lt;p&gt;If you’re unsure how well a feature is supported, Can I use is the holy grail. I would recommend to any frontend dev to take the time to read through all the features, their support and known feature issues. There is no better shortcut to levelling up your CSS knowledge.&lt;/p&gt;
&lt;p&gt;I hope you can see all the awesome stuff that can be developed using the features in this post. 2016 is the year to start using new features and create rich immersive user experiences. Whether it’s web apps or even a simple site. Never wait for “permission&amp;quot; to use new features just make sure you understand the support and consider fallbacks.&lt;/p&gt;
&lt;p&gt;Now go out and use them!&lt;/p&gt;
</content>
  </entry>
  
  <entry>
    <title>Tips and tricks</title>
    <link href="https://anthonydillon.com/tips-and-tricks/"/>
    <updated>2025-10-08T11:27:43Z</updated>
    <id>https://anthonydillon.com/tips-and-tricks/</id>
    <content type="html">&lt;p&gt;So I think we all have handy tips and tricks we have picked up over the years so I thought I would write them down and show you. I fully expect no one to learn something but you never know. 🤷‍♂️&lt;/p&gt;
&lt;hr /&gt;
&lt;h2&gt;Google Meet&lt;/h2&gt;
&lt;p&gt;&lt;strong&gt;ctrl + d&lt;/strong&gt; - Toggles the audio on/off&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;ctrl + e&lt;/strong&gt; - Toggles the camera on/off&lt;/p&gt;
&lt;p&gt;If you focus on the audio button, you can hit space to toggle the audio on and off.&lt;/p&gt;
&lt;hr /&gt;
&lt;h2&gt;Mattermost&lt;/h2&gt;
&lt;p&gt;&lt;strong&gt;alt + [up|down]&lt;/strong&gt; - This moved you up and down channels.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;shift + tab&lt;/strong&gt; will jump me to the last message in that channel.&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;ctrl + k&lt;/strong&gt; - brings up the channel switcher&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;up&lt;/strong&gt; - quick edit the last message&lt;/p&gt;
&lt;hr /&gt;
&lt;h2&gt;Gmail&lt;/h2&gt;
&lt;p&gt;Turn on keyboard shortcuts&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;x&lt;/strong&gt; - selects emails and can select multiple&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;y&lt;/strong&gt; - archives the selected emails&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;[&lt;/strong&gt; and &lt;strong&gt;]&lt;/strong&gt; - when in an email will archive and move in that direction&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;j&lt;/strong&gt; and &lt;strong&gt;k&lt;/strong&gt; - when in an email will jump to the next without archiving&lt;/p&gt;
&lt;hr /&gt;
&lt;h2&gt;Oh My Zsh + Git&lt;/h2&gt;
&lt;p&gt;&lt;strong&gt;gcm&lt;/strong&gt; - git commit main branch&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;ggl&lt;/strong&gt; - git pull origin &lt;code&gt;{branch_name}&lt;/code&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;gcam&lt;/strong&gt; - git commit -am&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;ggp&lt;/strong&gt; - git push origin &lt;code&gt;{branch_name}&lt;/code&gt;&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;grbi&lt;/strong&gt; - git rebase -i&lt;/p&gt;
&lt;hr /&gt;
&lt;h2&gt;Byobu&lt;/h2&gt;
&lt;p&gt;&lt;strong&gt;shift + f2&lt;/strong&gt; - create a horizontal split&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;ctrl + f2&lt;/strong&gt; - create horizontal split&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;ctrl + d&lt;/strong&gt; - close a window&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;shift + [up|down|left|right]&lt;/strong&gt; - moves you around the panels&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;shift + alt + [up|down|left|right]&lt;/strong&gt; - moved the dividers&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;f2&lt;/strong&gt; - creates new window/tab&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;alt + [left+right]&lt;/strong&gt; - switch tabs&lt;/p&gt;
&lt;p&gt;&lt;strong&gt;f8&lt;/strong&gt; - name tab&lt;/p&gt;
</content>
  </entry>
  
  <entry>
    <title>Writing specification documents</title>
    <link href="https://anthonydillon.com/writing-specification-documents/"/>
    <updated>2025-10-08T11:27:43Z</updated>
    <id>https://anthonydillon.com/writing-specification-documents/</id>
    <content type="html">&lt;p&gt;The practise of software design, even the addition of a small to medium size feature to a web interface should start with deep and calculated thinking. This thinking needs dedicated time.&lt;/p&gt;
&lt;h2&gt;Defining a summary&lt;/h2&gt;
&lt;p&gt;It&#39;s important to begin with a clear and to the point summary of the project. You and your team are not the only people that my read this document. Upper management might dip in to understand what the team are working on. A week written summary should provide an understanding of the project.&lt;/p&gt;
&lt;h2&gt;Explore solutions&lt;/h2&gt;
&lt;p&gt;The majority of time should be spent exploring options and solutions. If you think you have the correct solution try and find a few out of the box solutions which could stop you from arriving at a local maximum solution.&lt;/p&gt;
&lt;p&gt;Once you have explored options and have a proposed solution. It is time to reach approval from all stakeholders. This allows for early correction and keeps everyone on the same page.&lt;/p&gt;
&lt;h2&gt;Breaking down into tasks&lt;/h2&gt;
&lt;p&gt;Once you have approval. It&#39;s time to start breaking down the project into tasks. I suggest starting with a list of things you will need to do. Once you have the top level steps listed. Convert that list into headings and provide a brief description for the step. Under the description start to list smaller atomic tasks. Once you have achieved this. Convert the task lists into headings and provide a small description.&lt;/p&gt;
&lt;p&gt;You have now broken down the project into epics with nested tasks. You can copy these headings and descriptions into your project management tool.&lt;/p&gt;
&lt;h2&gt;Assigning success criteria&lt;/h2&gt;
&lt;p&gt;Without success criteria there is no way to check if a project was successfully. You should set a few measurable objectives. Be ambitious but realistic. Set a date in the future to review these metrics and report back to the stakeholders if the project hit or missed it&#39;s success criteria.&lt;/p&gt;
&lt;p&gt;By setting the success criteria at the planning stage. This gives you and the team time to set up means of measuring the metrics. For example adding analytics events to the right places during development instead of retrospectively.&lt;/p&gt;
&lt;p&gt;If a project is unsuccessful, your should investigate why and maybe even suggest remove the feature as all code incurs a maintainance burden on the team.&lt;/p&gt;
&lt;h2&gt;Living document&lt;/h2&gt;
&lt;p&gt;The specification document is not complete once it reaches approval. Keep the document alive with challenges, decisions and evolution. At any point during the project you may be vacant from the project. For example, you could be reassigned, become sick or leave the company. The team will need quickly catch up with your knowledge of the project. If the spec document has been kept up to date that will be a great help.&lt;/p&gt;
&lt;h2&gt;Turning specs into articles&lt;/h2&gt;
&lt;p&gt;Once a project has been completed you should be able to take the content from the document and with some light restructuring turn it into blog post about the feature. This helps to advertise the feature and attract talent to the by demonstrating the working process within the team.&lt;/p&gt;
</content>
  </entry>
</feed>