How I see myself is growing

Published at 2020-08-13

And I also eager to see how myself is transforming. It's the reason that I decided to re-build my personal website that I built 2 years ago.

I think it's always fascinating to see how a plant is growing. You sow strawberry seeds then water them every day. And soon, tiny sprouts come up, flowers bloom. Finally, strawberries appear. Those strawberries maybe not as sweet and tasty as the ones you buy from the market. But they should be the best strawberries for you.

And I also eager to see how myself is transforming. It's the reason that I decided to re-build my personal website that I built 2 years ago.

Re-design

I would like to use all my knowledge and experience to improve the old design, making it convey purposes more clearly with a cleaner and more consistent design. 

The purposes of my website are to show my professional skills (70%) and to share my stories (30%). Therefore, I decided the home page would present my professional experiences and projects. And for my stories...hmm... maybe I need a blog page. Yes, a new blog page. 

I started to audit the home page first then accomplished a list of stuff: 

  • Hero area is one of the most important sections on my website. There, I need a sentence that presents who I am, what I can do. And the text is easy to read. 

Hero area before
Hero area after

  • In the skills section, I've recognized that it was confusing to present skills using progress bars. Listing skills based on the coding and design field should be a good replacement. 

Skills section before
Skills section after

  • I choose my three favorite projects to introduce instead of six, changing the design to show project descriptions clearly

Project section before
Project section after

  • The contact form also needs some adjustments 

Contact form before
Contact form after

  • I changed colors a bit for higher contrast. The typography is also refreshed.

Style guide

Re-coding

My website used to be a static site built using HTML, CSS, and a bit of JavaScript. I thought it was a good chance for me to practice new web technologies. Ultimately, the site has been transformed into TypeScript with React.

The website before
The website after

So, I did it! It's not a large project. But it's an achievement for me like little strawberries. Of course, there is still room for improvement. Do you remember that I mentioned the blog? Yes, I gonna write about it in the next post.

Keep updating to see how my strawberry plant is growing!