#wiat

#wiat

What I ate today (#wiat) is an art project I started to record everything I ate over a whole year through instagram photos.

Those who know me have had to wait patiently for the past year while I’d take a photo, choose a filter, publish my photo on the instagram app and tag it – all before tucking into the food before me. I have been keeping a daily photo diary of everything I eat for a whole year, including meals (breakfast, dinner, lunch) snacks and drinks. As you can imagine I’ve heard all the comments, ‘why don’t you take a photo of what comes out the other end too’…oh how I laughed. And having to explain the project every time I ate with new people. But I didn’t let that deter me, for I could see the end result of the project in sight, that would eventually give me an overview of what I consume.

Eventually as I gathered more followers and likes, I I discovered the most popular food that people loved to eat (which is pizza by the way) but it also turned into much more than that. As time went on the project became about more than just stats, I actually learnt a lot about myself too and how people use food as an escapism from life and the daily 9-5 struggle. As a prominent reminder of this daily grind you can see in every cup of tea the reflective glow of those dull office lights, along with an increase in the number of snacks consumed – to allow myself to get from one point of the day to the next. Through this project I realised just how robotic we’ve become as a society, as though we are but a faceless cog in the 9-5 workforce machine. It made me think we’ve slowly started to loose our connection with what it means to be human – we should be free, creative, playful and having fun, not slogging through each day!

I also discovered the way I ate changed due to the environment I was placed in and I began to notice the overall things I ate changed too, subsequently I became a vegetarian after 1st October. I believe this was due to making conscious decisions about what I was putting into my body on a daily basis. The process of taking the photo each mealtime also ensured that whatever I ate had better be worth it!

Design

I wanted the design language of this art project to be a reflection of myself but also the playful and putty-like approach that I take on all of my projects. It is a testament to say that we don’t need to have everything figured out – we can take baby steps. And that’s what this project is about; to take a simple idea and then turn it into something beautiful by following your dreams without giving up, whether it is criticism or failure.

I started looked at the colours I would like to use. I wanted something bright, playful and exciting.

I looked around and around for hours and sometimes small snippets of minutes during my lunch breaks for this exciting and playful font that I would use. And I then looked at back and how grateful am I for the hard work that all the engineers, developers and designers put into making webfonts available and useful for all. It adds the hint of chilli to all of my projects. Then, one day surfing typekit, I came across the wonderful FF Enzo. The playful curves and thick font weight, give me a thumbs up and a nod from my design core.

I chose an odd column grid to induce that playful attitude I wanted to run through the design language.

 

I started putting together some concepts of the ideas running through my mind. I liked the idea of giving users the opportunity to browse through thousands of my food photos in a calendar layout. I also like the idea of using pills that would give them superpowers to look through my photos by colour, see other people’s most liked photos, or by food group.

Development

Now, I got to the hard part – being very stubborn and ambitious. I didn’t want to let a little development work stop me from creating a beautiful website that helped communicate my project. Luckily, I spent a lot of endless hours at university learning the basics of being a developer and it has now ensured that I can communicate design to other developers as well as tinker with it myself. There is also nothing more satisfying then seeing every little detail is designed and developed properly without any politics or ego – the way it should be.

Instagram

Instagram was the tool I used to capture all my data – a photo, copy, tags and a date. I found it to be a great way to keep a visual diary. As instagram was so easy to use, I could use it quickly every day and know that my data is being captured properly. I then used the #wiat tag would help find all the correct images.

Now, before I used instagram, I made sure they had an API that I use to access all the data I was creating. Don’t go using an app without finding out if you can export your data in a useful manner.

WordPress

I love WordPress and its ideology for being open and allowing people to play with the code, create plug-ins, etc. makes it a delight to use. PHP is pretty much the only development language I know and I am willing to use. It’s so simple, you code something, hit refresh on your browser and boom, the changes appear.

I started planning around with the Instagram API via PHP and JSON. I slowly created a bit of code to allow me to access all my wiat photos. I then played around with how I could turn each photo into a post in WordPress. That would then allow me to have a database of all my photos stored somewhere where I can access them via WordPress’ Query functionality.

Download WordPress plugin (17KB)
Use with caution as it’s not fully tested.

One big image

Now I had all my photos stored neatly in a database and downloaded onto my server. I could finally start to look at creating a massive canvas of all the photos – 3,500 photos in total! Once I had a copy of all my food photos, I then did some simple maths to figure out what the layouts would look like for one big image with 3,500 images inside it.

I opted to go for 70×50 size and it felt like the most nature size that would across multiple formats.

Being the Photoshop wiz that am I, it was pretty easy to put a contact sheet together to get a big massive final image of 21,350px by 15,250px and measuring at 1.2GB in size.

Map

I went through several home page designs, going round and round until I stripped it all back and made it about the photos of food. I wanted a simple way for users to see the entirety – my original vision was one a years’ worth of food in a single image.

I looked at many different javascript plugins and how I would go about showing people a huge image that would load fast, easily allow users to zoom in and out. I came across leafletjs which is actually a mapping plugin for creating custom maps but it was the perfect tool for me.

I just needed to find a tool that would split my big image into tiles that leafletjs could use. I found a very good terminal script that I could use to split my image up into multi-zoom levels and into tiles. Everything was going together very nicely!

My first art project

I started this project with the ambition to start something and finish it. I wanted to ignore all criticism and just allow me to be me. I felt like this project was not only a great outlet but it also allowed me to conquer my insecurities and turn a simple idea into something I believed was really cool. It helped me understand design better to; at the point when I finished this project, it suddenly dawned on that design is not about following trends but creating something unique in one’s own light.

Credits

Company

  • Me
  • Social

Devices

  • Computer
  • Mobile
  • Tablet

Roles

Art Direction
Visual Design
Front End Development
Back End Development