Using ContentLayer, it's easy to create a Prev & Next component if you want to encourage users to read one blog article and then the order. All it takes are two simple step. 1. Create related posts lo

This website has entered v3 of its iteration! v2 was created using Gatsby and integrated with my previous design resources `dojo.today`. Entering v3, I'm migrating the website from Gatsby to Next.js 1

One of the drawback of adopting Tailwind is spotting invalid classnames and combining styles according props. Cn function propose by ByteGrad help merging classnames and accept arguments. https://ww

A read from ADPList's substack There's even a designer matrix for your own reference

Cron, my daily calendar app, was rebranded as Notion Calendar last week after it was acquired. While I'm not a big fan of the new branding, it's incredible to see how an indie favorite calendar has be

Just want to bookmark this piece of of golden rule for making isometric stuff. You don't need a fancy template. Just create your own isometric graphic with a skewing Figma plugin (like SkewDat ) and r

It's a new year and quite a lot has been achieved this quarter. First of all, I have wrote my personal blog from scratch using NextJS as part of my practice. The hardest part was the API and synchroni

- Added all categories in resources page - Updated responsive typography sizes using fluid typography with clamp - Add PrismJS for codeblock - Incorporated digital garden setup by accepting Markdown f

I recall making font sizes fluid and scale in ratio according to the viewport was not an easy task few years ago. Here's the formula I had bookmarked from css-tricks.com ```css body { font-size: cal

How would you design a body check report? Last month, i received a physical copy of my body check result. Embracing “product designer” mindset had me rethink on the experience of body check. There co

Skip to bottom if you are already using Obsidian You cannot connect the dots by looking forward. You can only connect them by looking backward. <cite>- Steve Jobs</cite> I jotted down this quote from

Summary: Framework to ask the right questions to generate new & good ideas Nielson Normal Tips: - Avoid Suggesting a Solution - Keep Your HMWs Broad - Focus Your HMWs on the Desired Outcome - Phrase

Source: https://www.dannessler.com/intro-process

- Users: You're not designing for everyone, define your users properly - Needs: Do not mix solution with need, what they need can be solved by multiple solutions - Insights: Relevant insights After PO

Messing with RSS feed recently (as NextJS do not have any official RSS parser plugin) , I realised Chinese URL links generated were not validated. UTF-8 encoded Chinese characters were not considered

Being an early adopter of tools, one field that I cannot stop trying is the note-taking apps. The spectrum of note-taking apps has expanded quickly over the past 5 years. What I’m using now: For writi

Have you been relying on social media to promote your content? How did you cope with the uprising of new platforms? Discussion of decentralising the web has been going on for a while. Creating your ow

My post will be divided in 3 categories - Knowledge: Factual and learnings of a certain topic - Reflection: Personal progress or reflection (90% original content) - Exploration: Gather list of externa

Next has released @next/font solution to integrate with google fonts as well as local fonts. Check out https://nextjs.org/docs/pages/building-your-application/optimizing/fonts for the latest implement

Sparkline is a tiny chart to visualise trends of a series of data values. After The Flood created Sparks font to generate sparkline chart using a line of text, no Excel or any design software is requi

Recently, I worked on a concept design for a Electric Vehicle Charging Map App. Here's a recap of my thinking process, — how to enhance usability for a Search Journey? At first thought, you may think

- #### [[Write 4 Blogs about coding and design]] - #### [[Join 3 tech meetups and conferences]] - Attended Frustrated Design Pattern workshop by SmashConf - Attended Figma's design system conferen

Lack of progress in Q3 as I was really busy with moving and settling down . It was only until the end of the quarter, that I have processed with a new target and set of tasks to complete. Therefore, m

Introducing KEYSTROKE ⌨! My first Figma community template to create keycap quickly (with auto-layout support!). Quickly create keyboard shortcuts on Figma now! 1. Open figma community file 2. Click "

Brand new Safari and Firefox were both announced this month. Both versions received major design iterations. Which do you prefer? Announced in WWDC, Apple's new Safari is more ground-breaking in terms

One simple step to enhance your website's accessibility is checking your colors. 8% of all men suffer from color vision deficiency (0.5% in women), so 1 in 12 males that visited your website may exper

Stark has been a very helpful tool for creating accessible designs. The all-in-one accessibility toolkit has launched Chrome version after focusing on design platforms like Figma, Sketch and Adobe XD.

Catching up with some design documentaries in the last few months during quarantine, here's my recommended list! The two-season documentary series highlight artists across various fields of design. Ea

Recently I discovered Raindrop.io, a bookmark manager developed with designers in mind. There are multi-purpose views that you can set for each collection, Like List, Headlines Grid, Moodboard. Of cou

Good Product is not earning every dollar. Netflix recently announced they will start cancelling inactive subscriptions, Slack also carry out "Fair Billing Policy" to charge only active users in paid p

Simply put, sitemap is a list of pages of a website. It displays how your website is structured visually. Laying out sitemap can help you to improve your website navigation, you can also spot out the

The first tip from @juxtdesign is Accessibility ✌️ ! Accessibility matters because making your site accessible meaning even more people (more than 1 billion disabled people in the world 🧑‍🦯🧏🧑‍🦽)

Let's take a moment to appreciate the design of infographics and interactive websites created by major news outlet for the 2020 US Elections.

Independent film director Gary Hustwit announced to offer free streaming of his past work to encourage people staying home. First title would be his typography documentary Helvetica (2007).