Why did I build and deploy my own website?
2023.08.15
My thoughts on building and deploying my personal page so I can share my notions

Nowadays is quite easy to have your own website to showcase your portfolio. From portfolio pages like Behance, Dribbble, and Coroflot, to web builders like Squarespace, Wordpress, and Webflow. They all have in common the pre-made templates and simple customization to easily and quickly deploy your very own website. Perfect options for people that are not a developer or software engineers.

So, why did a designer, bachelor’s in industrial design specialising in graphic design, that has been working with UX for about 20 years, decided not to use one of those services?

I actually used some in the past and they worked well for some time but my main issue was how limited they were at a certain point or how some interesting features were locked behind a more expensive tier. I am not looking to run a business or just use it as a portfolio, but something in between that could fulfil my curiosity and be a platform for side projects, and since I have an interest in and have been learning some coding since my early days as a “front-end flash action script unicorn”, I decided to try it out.

I decided to use Nextra (opens in a new tab), a framework based on Next.js (opens in a new tab), mainly because it relies on Markdown (opens in a new tab) as a text formatting and has several features already in place so I don’t need to build from scratch. VSCode (opens in a new tab) as a code editor, GitHub (opens in a new tab) as a repository, and Vercel (opens in a new tab) as a host. Alongside Tailwind (opens in a new tab), MUI (opens in a new tab), Notion (opens in a new tab), Formspree (opens in a new tab), Storyset (opens in a new tab), and many others.

It does involve coding, so it may not suit you, although I do recommend any designer to at least get familiar with the technology of the product you are working, to better understand the limitations and how to extract the best out of it. At the same time, it can give you prototyping superpowers, saving you from the sea of links floating all around your canvas, and driving you nuts every time you need to update a flow.

Affordable

Everything I listed is either open source or has a free plan. Both GitHub and Vercel free plans are good enough, giving you access to everything you need to store your code and deploy. GitHub only can host your website, but Vercel gives you more services and capabilities. A domain was the only investment so far.

To write I am using Notion since I am already using it as my “cloud brain”. In fact, Notion allows you to publish public links so it could work as a website but you would be limited to the Notion’s look and feel and available features. Or you can pay for an external service and use Notion as a CMS. I found that I can just copy & paste the text from Notion into VSCode and it keeps the Markdown formatting, and maybe I can use Notion as CMS in the future using the available APIs.

Contact form I am using Formspree to not be worried about having my inbox filled with spam. It caps at 50 submissions per month, but this is way more than I am expecting. Otherwise, there is always LinkedIn.

You can definitely find alternatives to everything I listed, either due to familiarity or functionality. This setup works for me for now and I can easily replace any of those anytime, which brings me to the next point.

Independence

Being locked to a service is not fun at all. And services don’t like to lose clients either. Although some services do have tools and guides to help you export and migrate out, it is not as straightforward as it could be. Most of the services rely on custom and proprietary features that even if similar, may not work in the same way in the background after the migration.

Adobe Portfolio is a good example of a fully locked, with no way to export, apart from copy and paste. Any media uploaded is lost since there is no way to download it back. It is included as a perk in Adobe’s Photography plan but I recommend avoiding it.

In any case, keeping a backup and having an exit plan is always a good idea. Coding yourself does that automatically, always keeping a local copy synced to the cloud alongside a history, in case I want to revert back in time. I can create different branches so I don’t break my website when trying new features.

Having full control over my data allows me to decide which feature to add and how it should look and behave, enabling me to find a process that works well for me, e.g. using Notion as CMS.

Learning

This is the fun part! Technology has always fascinated me and learning new things is like a hobby for me. It is not about becoming a developer or software engineer but having at least the ability to understand how things work and the capacity to build something that works.

It helps me to empathise and better collaborate with developers and software engineers. Learning the capabilities and limitations helps me to bridge the business and the technology allowing me to have a good assessment of the impact vs risk, and identify any opportunities that may cause a positive impact on the quality of the product or on people's experience. It makes me a better Designer.

As I mentioned before, knowing how to code gives me prototyping superpowers. I can build immersive and closer-to-reality mockups and prototypes to get better feedback and user insights during the research phase, or help stakeholders to understand how a feature, product, or concept works, since trying out themselves always brings better understanding, leveraging the discussions and alignments. Of course, it all depends on your or your team’s skill to extract the most out of research even from a paper prototype, but I always felt a bit annoyed breaking the test’s flow by telling the user “Oh, this is not working… it is just a prototype”.

Experimentation

I like to experiment and try new technologies and processes to find better ways to work, create better products, or enable better experiences. Even if it is just for my personal use like a small app I built to fill up my movie's watch list in a Notion database using Notion’s and The Movie Database APIs. I know, overkill, but I was interested to learn more about APIs, so why not? This experiment helped me get a good understanding of APIs, try different design tools and UI libraries, try different automation tools, and experiment with different handoff methods.

I keep a list of APIs I am willing to try, related to different things such as home automation, services integration, data and AI, etc. Having a cloud platform that I can use to support is super handy.

Downside

Like everything in life, nothing is perfect. It takes time to learn and get the necessary skills, as it takes time and effort to build it. Being able to try everything doesn’t mean that you can, considering that you need to build it yourself, or find a solution that may fit closer to what you want. Debug is hard, and if you don’t have the proper knowledge, you will suffer a bit to fix it or make it work as intended. Most updates and new features have to be done and added manually. You are limited to your knowledge level and capabilities.

In the long run, this may not be sustainable anymore, unless AI takes over and make everything easier before becoming sentient and decides to dominate humanity.


Thank you for sticking with me and I hope you enjoyed it.

Feel free to check other areas of my page to learn more about me and don't hesitate to connect.