100DaysOfCode - Day 1

What is the challenge today?

My first focus was the 1st user story of the Pomodoro Challenge in FCC. Design a Pomodoro Clock with Material Color and some nice glassy 3D surface.

How did I tackle this?

In my mind, I imagined a round shape of the clock (sorry, old school!) and some portions of the round surface disappearing in sectors as time passes.

Crazy searched on Google (kidding!) - I used Google image to quickly choose the sites with effects fitting my imagination. Then I went there and quickly copied pasted the key codes (sorry, can’t bear with the boredom of learning CSS3 step by step) and went to adjust the values to get the fitting effects for my project. Then, I proceeded to read the explanations of the CSS codes.

Similar procedures were in place for making the clock surface disappear in sectors.

Was it solved?

The basic design is decided, but I would upgrade to a full bevelled glass effect if I have time. The sectors are not yet experimented, so may cost more time tomorrow during JS implemntation

See the Pen FreeCodeCamp-Project: Pomodoro Clock -Basic by Aris Huynh (@arishuynhvan) on CodePen.

What did I learn?

Time management over perfectionism.

How to embed Codepen into Jekyll blog md file

What else should I try next (or next time)?

Stick to simplicity!!! Maybe, I should limit the number of lines for CSS effects that I should use to 5 lines max (transformation only, other properties excluded)

What did I help others with today?

Oh no, I forgot to help others (CRY!!!!). And it’s already MIDNIGHT EXACTLY!

How do I think/feel about that?

So terribly upset! This totally slipped my mind NOOOOOOO! >~<

Written on January 6, 2017