[{"data":1,"prerenderedAt":212},["ShallowReactive",2],{"product-playback":3},{"id":4,"title":5,"body":6,"demo":196,"description":197,"extension":198,"media":199,"meta":205,"navigation":206,"path":207,"seo":208,"stem":209,"updated":210,"__hash__":211},"projects\u002Fprojects\u002Fplayback.md","Playback",{"type":7,"value":8,"toc":185},"minimark",[9,14,18,21,25,33,41,44,53,62,66,69,97,104,124,129,137,142,146,167,170,174,177,181],[10,11,13],"h2",{"id":12},"why-does-playback-exist","Why does Playback exist?",[15,16,17],"p",{},"Every December, music lovers get their stats and developers get their commit history. Designers get a dashboard of files called Final_Final_v3. They spend thousands of hours on versions, comments and reviews, and never see the big picture.",[15,19,20],{},"Playback turns that history into a year in review you can play with and share. It doesn't just count versions: it looks for the stories in a file, like who argued the most, who worked late into the night and which day everything happened at once, and turns each one into a small game. It's a little cheeky on purpose.",[10,22,24],{"id":23},"how-did-it-start","How did it start?",[15,26,27,28,32],{},"As an entry for Figma's #FigmaMakeathon in September 2025. Jinson built the first version in Figma Make and called it ",[29,30,31],"strong",{},"Figma Rewind",": paste a file's URL, and get an interactive, Wrapped-style report of its year.",[34,35],"page-figure",{"caption":36,"height":37,"src":38,"width":39,"poster":40},"Figma Rewind, the Makeathon version, built in Figma Make.",614,"\u002Fimages\u002Flog\u002Fplayback-1965605692045472196.mp4",960,"\u002Fimages\u002Flog\u002Fplayback-1965605692045472196.webp",[15,42,43],{},"A month later, Friends of Figma Dubai held a Figma Make event with a showcase of projects from the community. Figma Rewind was one of four finalists, and Jinson demoed it on stage to the community and the Figma team.",[34,45],{"caption":46,"height":47,"src":48,"width":49,"alt":50,"credit":51,"credit-url":52},"Presenting Figma Rewind at the Friends of Figma Dubai Figma Make showcase, October 2025.",870,"\u002Fimages\u002Fproducts\u002Fplayback-fof-dubai.webp",1010,"Jinson Johny presenting on stage at the Friends of Figma Dubai Figma Make event, holding a microphone behind a laptop, with a “Make it happen!” banner behind him.","Photo: Friends of Figma Dubai","https:\u002F\u002Fwww.linkedin.com\u002Ffeed\u002Fupdate\u002Furn:li:ugcPost:7381975580742709249\u002F",[15,54,55,56,61],{},"Then it grew into Playback, with its own home at playback.design. Jinson launched it for 2025 on 29 December with ",[57,58,60],"a",{"href":59},"\u002Fwriting\u002Ffigma-playback-2025","“Your Year in Pixels”",", and on Product Hunt the next day.",[10,63,65],{"id":64},"whats-in-a-playback","What's in a Playback?",[15,67,68],{},"Eight slides, from the cast to the finale. Every slide has the same shape: an interactive motion area on top, and the data insight below, so you play with the numbers instead of just reading them.",[70,71,72,79,85,91],"ul",{},[73,74,75,78],"li",{},[29,76,77],{},"The Roll Call."," Everyone who touched the file. Hover over a person to see their versions and comments, and who contributed what.",[73,80,81,84],{},[29,82,83],{},"The Chief Comment Officer."," Whoever had the most to say, with their comment count. Pull the hanging string and their comments tumble out, like that one review that went on too long.",[73,86,87,90],{},[29,88,89],{},"The Midnight Oil Burners."," The night owls. The slide goes dark, and you find them with a torch.",[73,92,93,96],{},[29,94,95],{},"The Day Everything Happened."," The single busiest day of the year, and the people who got through it.",[34,98],{"caption":99,"height":100,"src":101,"width":102,"poster":103},"The Day Everything Happened: the busiest day of the year, in versions and comments.",720,"\u002Fimages\u002Fwriting\u002Ffigures\u002Ffigma-playback-2025-4.mp4",1100,"\u002Fimages\u002Fwriting\u002Ffigures\u002Ffigma-playback-2025-4.webp",[70,105,106,112,118],{},[73,107,108,111],{},[29,109,110],{},"The Zen Moment."," The quietest day, with the team lounging by a pool, until you stir things up.",[73,113,114,117],{},[29,115,116],{},"The Need for Speed."," The fastest replier, and the slowest, buried under a pile of unanswered comment bubbles. Click to pop them and dig them out.",[73,119,120,123],{},[29,121,122],{},"The Great Debate."," The thread with the most replies fills the screen. Type its letters to clear it away and finally settle the argument.",[34,125],{"caption":126,"height":100,"src":127,"width":102,"poster":128},"The Great Debate: the most-discussed thread, turned into a typing game.","\u002Fimages\u002Fwriting\u002Ffigures\u002Ffigma-playback-2025-8.mp4","\u002Fimages\u002Fwriting\u002Ffigures\u002Ffigma-playback-2025-8.webp",[70,130,131],{},[73,132,133,136],{},[29,134,135],{},"The Grand Finale."," The whole team together, with the key numbers and the badges they earned along the way.",[34,138],{"caption":139,"height":100,"src":140,"width":102,"poster":141},"The Grand Finale: the year in versions, comments and members.","\u002Fimages\u002Fwriting\u002Ffigures\u002Ffigma-playback-2025-9.mp4","\u002Fimages\u002Fwriting\u002Ffigures\u002Ffigma-playback-2025-9.webp",[10,143,145],{"id":144},"how-does-it-work","How does it work?",[147,148,149,155,161],"ol",{},[73,150,151,154],{},[29,152,153],{},"Open playback.design."," It runs in any browser, with no plugin to install and nothing to download.",[73,156,157,160],{},[29,158,159],{},"Log in with Figma."," You give Playback read-only access to your account.",[73,162,163,166],{},[29,164,165],{},"Paste a file's URL."," Playback fetches the file's history and plays it back as your report.",[15,168,169],{},"It works on personal files, but it's best on a team project. Finding the slowest replier, or the people who pulled all-nighters, turns a year of data into a team-bonding moment, or a friendly roast. It's a good way to close a year of working together.",[10,171,173],{"id":172},"is-my-file-safe","Is my file safe?",[15,175,176],{},"Yes. Playback uses the official Figma API and asks only for the metadata it needs: versions, people and comments. It never reads your designs or their pixels. Everything is processed in your browser: Playback fetches the data, shows it to you, and it's gone. Nothing is saved to a server.",[10,178,180],{"id":179},"timeline","Timeline",[182,183],"project-timeline",{"id":184},"playback",{"title":186,"searchDepth":187,"depth":188,"links":189},"",2,0,[190,191,192,193,194,195],{"id":12,"depth":187,"text":13},{"id":23,"depth":187,"text":24},{"id":64,"depth":187,"text":65},{"id":144,"depth":187,"text":145},{"id":172,"depth":187,"text":173},{"id":179,"depth":187,"text":180},null,"Figma Playback by Jinson Johny is a “Spotify Wrapped” for your Figma files. It turns a file's versions, comments and contributors into an interactive year in review. Started at Figma's","md",{"src":200,"poster":201,"alt":202,"width":102,"height":100,"credit":203,"creditUrl":204},"\u002Fimages\u002Fwriting\u002Ffigures\u002Ffigma-playback-2025-2.mp4","\u002Fimages\u002Fwriting\u002Ffigures\u002Ffigma-playback-2025-2.webp","Figma Playback's opening slide, “Meet the people behind the pixels”: the avatars of everyone who worked on the file, with their versions and comments on hover.","“Your Year in Pixels” on Medium","https:\u002F\u002Fmedium.com\u002F@jinsoncjohny\u002Fyour-year-in-pixels-get-your-figma-playback-for-2025-b4e0e37dbc16",{},true,"\u002Fprojects\u002Fplayback",{"description":197},"projects\u002Fplayback","2026-10","7_tPnpl8dEdXG3l7fMjHVDe-r9GLKY13cTHGGYskWps",1793655448731]