Tuesday, 26 March 2019

DIGITAL CLOCK ANIMATION (USING YOUTUBE TYPEFACE)

As the Youtube typeface that I created looks really digital. The typeface look really like the font that is widely used on digital clocks. It is chopped into sections horizontally as the grid system has some empty gaps in between column of grid. The sectioned characteristic of the typeface is what makes it look like the digital clock typeface. 
Also, time is the main element of the 2maps that I created. One represents daytime and another represents nighttime. I thought I would be a good idea to emphasise on the time concept and further develop it. Therefore, I came up with the idea of using the typeface to make digital clock GIFs. 

1ST ATTEMPT
In order to see if the idea works or not, I decided to make one simple one with the colon flashing, it does look like a digital clock and proves that this idea would work. 
FRAMES


RESEARCH
- The digital clock typeface is usually in the colour of neon green. 
- Each stroke of the typeface is made up of a long thin hexagon which makes it look as if they were being chopped into many sections. 
- The typeface uses the number 8 as its base 



In order to make the GIF more realistic like a real digital clock, I should use green. 

2ND ATTEMPT
Made another one with typeface coloured in green. I used the green from the above image, however, the neon green could not show as it is not a CMYK colour. Anyways, the result turned out to still looking like a digital clock. 

FRAMES


11:30-11:40
To test out the flashing colon with numbers changing, I decided to make a short one which flashes from 11:30-11:40. I made one frame for each minute and have the colon on each even number frame. It ended up with the colon not working right with the numbers. It should not flash at the same time with the numbers. 


FRAMES





REFINED VERSION
In order to make the flashing right, there should be two frames for each minute. One with colon and one without. Finally, the outcome turned out like an actual digital clock. I could carry on making the full GIF flashing from 11:30-12:30.  

FRAMES

tota:l 120 frames 

PROCESS
All the frames were being uploading onto the GIF maker website. They are being rearranged into the right order, with each minute having a with colon and without colon frame. 


FINAL GIF
11:30-12:30 
The 11:30-12:30 is made of having a with colon and a without colon version of each minute frame. The flashing colon cooperated well with the flashing minute digits. 





1 comment:

  1. I would like to use this in my classroom. Would you be willing to send it to me? I am teaching the concept of time to special needs kids.

    ReplyDelete