drafts
A list of things to think about. And maybe find some time to turn them into pet projects.
๐ง Another music-stats dataviz
circles (animated through time: growing, moving)
- artists represented as circles (area is proportional to total scrobble count), colored by genres
- animated transitions between views:
- map: artists distributed within countries (polygons without stroke)
- cloud of genres: gravitated circles
- scrobble timeline:
- x: last scrobble time
- y: total scrobble count
- artists activity timeline:
- x: artist activity years
- y: total scrobble count
- animation to: moving a circle, collapsing to a point, then expanding to a line (or a set of lines, if there were years of inactivity)
- animation from: same but backwards
๐ Location editor/remover service
- pre-selection by dates, by shapes (circles, rectangles, polygons)
- a map with marker clusters, to see how many photos have location attached
- batch removal, if supported by external APIs: Google Photos, iCloud
๐ง A grid extension for laying out front-ends
- resizable rulers, semitransparent dashed lines
- separate grids attachable to selected DOM elements (via a context menu option)
- movable 0-points (negative numbers on the left/top)
- configurable offset patterns (for vertical rhythm)
- clickable colored cells (to draft high-level layout containers quickly)
See:
๐ฌ An extension that tracks requests destinations
- collect number of requests made to different domains
- compare the current one (origin) to externals
- render various charts (with d3 utils)
- re-playable "live" reports (based on persistent logs)
- blockers comparison (draw milestones when some blocker got installed/removed)
๐ฌ An extension that measures time spent in active browser tabs
- completely client-side (no requests triggered from the extension, no tracking)
- collect:
- "start/finish" timeframes (in active tab)
- times a URL is entered, together with navigation within the domain (path-level gradation)
- display a summary and trends to showcase patterns (how much time is spent with which website)
- filtering and whitelisting (if only certain domains are interesting)
- grouping (productive, social, news, etc.)
๐ง Physical scrobbler
- a semi-automated scrobbler, connecting Discogs and Last.fm APIs
- user flow:
- find a record via a search box (by artist, album, catalog number, etc.) or select it from the personal collection
- choose which tracks to scrobble and which to skip, enter a starting time
- click "scrobble", check the status
- if the record is scrobbled for the first time, it could be added to the personal collection
- optionally edit the record in the collection, e.g. choose a particular release, add/remove tracks, add notes
- existing integrations: Vinyl Scrobbler, Open Scrobbler, Universal Scrobbler, The Record Scrobbler
๐ฎ Functional strategy game
- units - actors
- each unit type is configured with some predefined set of aspects
- units influence each other
- groups could gravitate the others
- different kinds of units: heavy, dynamic, robust, resilient etc.
- colors represent reactive interconnections
๐ Personal/family budget tracker
- define categories/subcategories
- log (consider sort of a biweekly calendar)
- plan (place predefined amounts and recurring payments)
- biweekly/monthly graphs to observe trends
- Sankey diagrams for yearly reports, consider
d3-sankey
๐ญ "Social disconnector" - a web service that organizes chosen subscriptions
Like Feedly, but for social media. The idea is to eliminate noise by reducing time spent on native feeds, having a list of accounts/tags you could explore just like RSS feeds. That implies a need to be authorized by corresponding providers.
See:
๐ฎ Pixel, turn-based game
- units: battleships (different in size and other params) and docks
- resources: money, steel and fuel (convertible), the more shore territories are controlled, the more resources their bring
- one game move - select (one or more ships), shift to another area (depends on available speed and fuel) and fire (a target needs to be defined) or skip
- ships are pre-selectable before the round starts and also could be built in docks
- damage depends on number and power of guns (sum of all guns on all selected ships)
- different guns have different effective areas, accuracy, damage power and (most importantly) - shell limits
- ships have armour that can be damaged (instantly) and repaired (if small - slowly during game moves, faster - in docks)
- a ship could be captured (either turned into an abandoned obstacle or refueled/recharged and became controlled), if it runs out of fuel or ammo
- a map is not fully visible - it's limited to areas close to player's ships and controlled shores
- damage is based on proximity - each shot looses precision with distance growing
- it's a multiplayer, but turn-based game (time limit is configurable) - every player defines a move and then all involved ships (of all players) execute those moves - they shift, fire, receive damage and eventually sink
- when ships of player A define a target among ships of player B, they should aim for the upcoming position of those B-ships, i.e. guessing a place where B would point the ships to
- number of players is not limited to 2, it starts from 1 (training mode with static targets) and can grow to some meaningful limit (e.g. 8)
- each turn is recorded, so rounds could be replayed
โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ
โ โโโโโฒ โโโโฒ โ
โ โโโโโโธ โโโโโธ โฑโโโโ โ
โ โโโโโฑ โโโโฑ ยทยทยทยทยทโฑโโโโ โโโโโโ โ
โ ยทยทยทยทยท ยทยทโโโโโโ โฒโโโโ โ
โ โโโ โโโโโโฒยทยทยทยทยท ยทยทยทยทยทโฒโโโโ โ
โ โโโ 5โโโโโโธ ยทยทยทยทยท โโโ โฑโโโโโโโ โ
โ โโโ โโโโโโฑ ยทยทยทยทยท โโโ โโโโโโโโโ โ
โ โโโ ยทยทยท ยทยท โโโ โฒโโโโโโโ โ
โ โโโ โ3โ ยทยทยท ยทยท โฒโโฑ โ
โ โฒโโฑ โโโยทยทยท ยทยท โพ โ
โ โพ โโโยท ยทยท โ
โ โฒโโฑ โโโฒยท โฑโโโโโโโ โด โ
โ โพ 2โโโธ โฑ โโโโโโโ โฑโโฒ โ
โ โโโฑ โโโโโโโโโโ โโโ โ
โ โฒ โโโโโโโ โโโ โ
โ โโโโโโโโโโฒ โฒโโโโโโโ โโโ โ
โ โโโโโโโโโโโฒ โ
โ โโโโโโโโโโโโธ โโโโโโโฒ โ
โ โโโโโโโโโโโฑ โโโโโโโโธ โ
โ โโโโโโโโโโฑ โโโโโโโฑ โ
โโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโโ
๐จ Pixel font
- some characters are already used, see examples below
- see "A beautifully illustrated glossary of typographic terms you should know" for terminology