Last time I worked on my personal portfolio, I was working from a not-so-color-perfect display, with very less knowledge on web development and responsiveness.
This one's different, way different.
The Plan
My Layout Preferences
An ideal website in my opinion would be a no clutter, clean and minimal layout. I also loved presenting data in the form of beautiful visualizations, and realised I could somehow bring these two concepts into my portfolio.
Initial Ideation
I already had a vague idea that I would be majorly having a single focus point on the landing page, either my name in some fancy font / visualisation integration or a well edited image of me with some cool blend / mix effects. Latter was ruled out pretty quickly as I realized these two points -
- I did not want the viewers of the website to be fascinated by my
object-fit: containskills - My photoshop skills were very basic
So cool + minimal visualisation with my name was decided.
Design Inspirations
- Notion
- Super - which had a amazing showcase section with super minimal but effective layouts
- Covid-19 Tracker
Planned Functionalities
- Dark mode toggle (a necessity in all websites in 2021 in my opinion)
- Buttons to redirect to social media
Planned Tech Stack
- React - been using it for more than a year now, loving it
- d3.js - didn't go for any charting / visualisation libraries as this gave me more power to customise everything
- react-spring - spring based animations felt so much more natural than timing based animation
- CSS modules - needed scoping so that I didn't have to worry about naming conventions, but didn't want to go for JS styling libraries as I didn't want any unneseccary overhead.
With all that decided, I started developing the landing page.
Top comments (0)