Behind the Scenes of Development of My Personal Website…

It's been so long since I have been waiting for this very moment to launch my personal website. After putting it online, I have got a lot of people asking me for what’s the name of the theme and if they can also get it. Well, I had to convince them that it's my own design and yes, most of the queries are from my Indian friends, too curious. 😳

Old Website

a.k.a. Motivation to New Website

Okay, to start with, let's start with my old website that was there like this:

Old Website

I loved the look and feel, but it was missing a lot. First thing was, the very much simplicity look of my website. I love a simple design, but at the same time, I would like it to be the representation of myself and my feelings. A few things about me include my favourite sky blue and orange colours, a huge banner picture taken at a place which I love a lot, in this case, it's DisneyLand Paris (my dad's gift for my birthday) and obviously, a portfolio of my works.

My old website lacked every single thing that I mentioned above, but for some reason I loved the look and feel because of its simplicity and to the point nature of the design. So yes, the old website had a straight-forward information about me:

And going further, I have literally no clue, why I even included this section when I have no contents or a lot of contents that needs to justify this section:

As a digital world and technology person, I really have to emphasise on things that I do and with the above content, I don't think it is enough. Forget enough, it doesn't even justify what I do and to what extent I do, and I would say my Stack Overflow Profile is far better than my old website.

Now comes the testimonials, what others think about us. There should be a way for us to quantify our quality works. The old design is at least good in that aspect.

The final thing is the way to contact us. The old design had a nice and clean layout, where I had my physical (logical?) address on the left and there's a form on the right that puts all the responses into a database:

It also digests and sends an email to make sure I keep track of stuff and well, yeah, push notifications as well! So yeah, after about three months of these horrors, I thought on my birthday this year, I took up a promise that within three months, I am going to do a complete revamp, and yes, for the passion of my life, I completed revamping the whole website in less than three months! Yay!

New Website

Expectations

Without any expectations from the new website, I cannot take up this whole thing. Here are the expectations of my new website. Please note that I have the redundant expectations from the previous website as well. Think of this as a whole new project.

  • A huge welcome banner rotator with my picture as background.
  • My social network and web presence details.
  • Top navigation bar with gradient black background.
  • Sticky top navigation bar with solid background.
  • All my roles, abilities and nature in the main slide-show.
  • To the point introduction about me, my history, and my skill-set.
  • Links to my achievements and professional profiles.
  • Attracting way of letting know my service pricing tables.
  • My full experience and education in a timeline manner.
  • Portfolio of all my works till date in a non-obstructive manner.
  • My recent blog posts in a better user experience with thumbnails.
  • My testimonials and reviews from other places.
  • A nifty "keep in touch" form with a personal touch.
  • Professional SSL Certificate for at least 100,000 $ warranty.
  • Quick page load times and payload.
  • Nicely formatted email for all the messages I receive through the website.
  • User behaviour analytics to study how users perceive my website.
  • And finally, DMCA Copyright for encryption.

With all the above in mind, I created a quickie wireframe of how I want my website to look. That was the craziest ever pen drawing I have ever drawn. You can have a look at some glimpses here:

And this is what you would find in my deployment server! All crazy commit messages and stuff! Oh my god, thanks to my wife, my dad, all my friends, who supported and helped me in getting this up and running. Without you guys, this wouldn't be even possible!

This article is almost as huge as triple sixteen marks answer in Anna University. I don't want to annoy you all by adding more stuff. I am going to release this as four part post with the next parts covering the following.

This is the introduction for the series:

  1. Intro: Behind the Scenes of Development of My Personal Website...
  2. Part 1: Behind the Scenes: Design ideas for My Personal Website...
  3. Part 2: Behind the Scenes: From Design to Development, what went wrong?
  4. Part 3: Challenge: Find the 🤐!

Note: You may not find the page until it has been published. So, if you encounter "Page Not Found", it means that I haven't completed that article.

Well, the last one is a challenge. Yes, you heard it right. It's a challenge and you will be eligible for winning some prizes.



comments powered by Disqus