Freya's time at Mesomorphic

Freya Murphy shares her experiences on her work placement with Mesomorphic.

• 21 August 2018
• By Freya Murphy
•  Work Experience

Introduction

My name is Freya Murphy and I have just finished my second year at the Univeristy of Dundee studying Computing Science.

I found out about Mesomorphic after looking into what work experience would be available to me at home in Shetland over the summer. I wanted to find out what it’s like working in a software company to help me decide which career path to take after university.

Day One

I was quite nervous to start my first day but I was quickly given a cup of tea and made to feel welcome. Maria helped me get set up at my desk and gave me a tour of the office.

My first task was to write an overview of Mesomorphic’s Swoop software for other work experience people to read in the future. I spent a while getting familiar with the front end of the software and then Matthew explained how the back end Swooper searches websites to find potential counterfeit products.

After lunch Maria showed me some of the business side of working at Mesomorphic. Even for a small business there is a lot of information to keep track of! Thankfully there were some nice graphs to look at as well as the spreadsheets.

I spent the rest of the afternoon sitting with Tim and Matthew to get an idea of what their work as developers involves. Tim was having a hard time fixing a particularly difficult problem with the Swooper so I spent most of the afternoon with Matthew learning about test driven development.

Day Two

This morning Matthew helped me get set up to edit the Mesomorphic website. This will allow me to post on my blog and make some pages about code club that Maria has asked for.

Maria explained that she wanted a hidden page for members of the code club to unlock and a normal page to advertise code club on the website. I hadn’t done any web development in a while so I was a bit rusty but after reading through the code for other pages on the website I was able to figure out what to do. I started with the hidden page which involved creating a new layout and modifying the ‘contact us’ form from the rest of the website so that code club members could submit their names.

The basic functionality of the page was there but it looked a bit boring. Maria had mentioned adding fireworks so I did some research on how I could achieve this. I found some cool examples of animated fireworks coded using Javascript and I thought I might be able to do something similar. I’d made some Javascript animations before but only in an environment that handled some of the harder bits for me, so I needed to figure out how to make the whole thing from scratch.

I managed to draw the first frame of the animation but after that I got stuck. Whenever I called the function which was meant to start the animation the firework disappeared from the screen. I spent a while getting very confused until Matthew helped me fix some of my bugs. After Matthew’s help the firework didn’t disappear but it didn’t move either. I found this to be an improvement and called it a day.

Day Three

After updating my blog I got straight back to my firework. As usual spending some time away from the computer had made it much easier to solve to problem. I fixed a few typos and suddenly the firework was animated! After adding some finishing touches I felt like my firework display was complete.

After lunch I started work on the public code club page. This time I didn’t attempt any over-ambitious graphics so it went quite smoothly. I saved time by modifying a quote slideshow that was already on the website so that it showed photos of code club instead.

I committed my work to Bitbucket for the rest of the team to review. They seemed to like the fireworks but Maria asked if they could fade out after they’ve exploded. This would take quite a lot more work but I agreed with her that it would look better. Matthew helped me brainstorm some ideas which I’ll look into in more detail tomorrow.

Day Four

I started the day by replacing the placeholder images on the code club page with the photos Tim had taken at the last code club session. After stand up (a daily meeting where we discuss what we did the day before and what we hope to achieve today) I got to work on making a fade animation for my fireworks.

Now that I understand how to make Javascript animations work I had few problems. I used Matthew’s idea of filling in the entire canvas with a transparent rectangle and gradually increasing its opacity until the firework was hidden. This was much easier than trying to keep track of where I had drawn the firework and only fading that part of the canvas.

The main issue caused by having multiple firework animations happening at once was that the frame rate of each animation was decreased. The browser can only execute one piece of Javascript at a time so if one firework is exploding while another is fading it has to keep switching between them making the animation slow and jerky. To minimise this problem I made the fade animation quite short so that the majority of the time only one animation is taking place. I also added a timer so that the firework stays on the screen for a while before fading away, since the static firework will not affect the frame rate. Check it out!

It was a lovely day so during my lunch break I decided to go for a walk. Unfortunately when I returned I discovered that I had been locked out. I knew that Tim would be back from his bike ride soon so I decided to wait for him. However it turned out that Tim had forgotten his keys so we were locked out together. Eventually Matthew came back and let us inside. I was glad that it was so sunny because yesterday we would have been soaked.

I spent the afternoon working with Matthew to fix a small bug in the Swoop software where a product field wasn’t displaying properly. He talked me through the process from how to identify the problem to running the tests at the end. After that we played code tennis for a while. This involved Matthew writing a test and me writing as little code as possible to pass the tests. This sometimes resulted in me writing some ‘bad code’ to force Matthew to write better tests. I hadn’t done any test-driven development before and I found the code tennis really useful to help me understand the process. I’m sure it will come in handy when I go back to university.

Day Five

This morning we had some issues with our internet connection. The wired internet connection was broken and the council WiFi in the office stopped working because the undersea cable got damaged. It’s pretty hard to program effectively without any internet so we tried to come up with ideas to solve the problem, including using Matthew’s phone as a hotspot. Thankfully the wired internet started working again so we only had to use a small amount of Matthew’s data.

While the internet was off I continued to add to the work experience page of the website and my blog. I set the date for my blog to be the 21st, since that’s the last day of my work experience and presumably the day I will upload it to the master branch of the website. However the post wasn’t being added to the development branch of the website that I was running on my computer. Matthew and I spent a while trying to figure this out until I realised that it was because the date of the post was in the future. This gave Matthew the idea to add a timer to the website so that it would automatically rebuild once each day, adding any blog posts with with a date for that day. This would allow people to schedule blog posts for the future.

I wanted to add my fireworks animation to my blog since I can’t link to the hidden page it’s on. This caused some problems at first because the fireworks were filling the entire screen. I wanted them to be constrained to a container at a specific point in the blog post. After trying to change the height on the animation in many ways, I decided to check Stack Overflow. Of course there was someone with the exact same problem as me. It turned out that I had set the CSS position property to the wrong value, and after changing it the animation was fixed.

At 4 o’clock we had the weekly code review. This is when people show some code they have been working on and everyone gives advice on how to improve it. I had a chance to show everyone the work I had done on the website and get some useful feedback.

Day Six

Maria gave me a library project that another work experience person had been working on to look at. It was written in Ruby which I’m not very familiar with and it had no documentation, so understanding it was a struggle. After doing a lot of Googling I was able to add enough comments to roughly understand what was going on.

Maria and I went to The Dowry for lunch to review my time at Mesomorphic. I was able to give feedback on what I have enjoyed and what I think could be improved for work experience in the future.

In the afternoon I sat with Matthew and Tim while they tried to fix a bug in Swoop. Some product prices were displaying wrong because the currency conversion wasn’t working. It turned out the main problem was that some currencies use a dot as a decimal point and some use a comma. The test product we were searching for was ‘octopus costume’ and I enjoyed laughing at the ridiculous costumes that some websites were selling.

Day Seven

I spent the morning updating the website to reflect the feedback I got during code review last week. This included modifying the layout slightly and compressing my fireworks script into the main script that is included on every page in the website. Matthew took a few photos of me to add to the work experience page and my blog.

While I was updating my blog I noticed an issue where, in portrait mode, the category buttons became very large and I couldn’t click any text in the blog post. Using Inspect Element showed that the div element containing the categories had grown to fill half the page! I brought this up with Matthew and he noticed that the blog slidebar had a typo in its class attribute. I was easily able to correct this and fix the website.

I’ve really enjoyed my time at Mesomorphic. It’s been great to see techniques such as agile methodology and test-driven development in a real company rather than just learning about them in my lectures. Everyone here has been very friendly and helped me to learn.