Hi, Hello! My name is Sarah - the writer behind redgregory.com.
.png%3Ftable%3Dblock%26id%3D2c4d8526-d1e1-4cb6-9207-4efff79510aa%26spaceId%3D3d51c61d-92e0-4365-824e-4c7cd9f90627%26expirationTimestamp%3D1732456800000%26signature%3D-wcwZ1OR7K2tpeQGqXXHHbJEjJbIQQZR9Qb7BYratcQ?table=block&id=2c4d8526-d1e1-4cb6-9207-4efff79510aa&cache=v2)
Yes the Notion progress bar is a great addition to a workspace, but what about the double progress bar?
What Exactly Is Going On Here?
- Let's say you have a database with a
deadlineandproject progressvariables (ie. total pages/pages read for book progress).
- The double progress bar will act as a visual cue for the user to determine where the project's progress lies parallel to the distance to the deadline.
The Two Progress Bars:
What You'll Need For This Example
- 2 number properties to find book reading progress named "Total Pages" and "Page on"
- A date range property named "Start → Stop Reading"
The Scenario
THE SCENARIO: Imagine you are an English major (like I was) and you want to find the relation between book reading progress and the deadline you've set for yourself to finish said book (ie. in
2 weeks)
THE GOAL: Simply, make sure the green book leads the red circle!Double Progress Bar
Name
Total Pages
Page On
Start → Stop Reading
Progress Bar
Final Formula
"Progress: " + format(slice("‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒", 0, floor(20 * prop("Page On") / prop("Total Pages"))) + "📗" + slice("‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒", 0, 20 - floor(20 * prop("Page On") / prop("Total Pages"))) + " " + format(floor(100 * prop("Page On") / prop("Total Pages"))) + "%") + "\nDeadline: " + format(if(dateBetween(start(prop("Start → Stop Reading")), now(), "days") > 0, "⭕‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒ 0%", if(dateBetween(end(prop("Start → Stop Reading")), now(), "days") > -1, slice("‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒", 0, floor(20 * dateBetween(now(), start(prop("Start → Stop Reading")), "days") / dateBetween(end(prop("Start → Stop Reading")), start(prop("Start → Stop Reading")), "days"))) + "⭕" + slice("‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒", 0, 20 - floor(20 * dateBetween(now(), start(prop("Start → Stop Reading")), "days") / dateBetween(end(prop("Start → Stop Reading")), start(prop("Start → Stop Reading")), "days"))) + " " + format(floor(100 * dateBetween(now(), start(prop("Start → Stop Reading")), "days") / dateBetween(end(prop("Start → Stop Reading")), start(prop("Start → Stop Reading")), "days"))) + "%", "‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒‒⭕ 100%")))
More about how to make the slider progress bar Slider Progress Bar Use-Cases
Extra: How To Enter A New Line In A Formula
- Insert (+ "\n") for new line
My Mood
Highest Performing Tweet
Content Published This Week
