Takuya Matsuyama Portfolio
Freelance full-stack developer / creator of Inkdrop
A dark, mint-teal-accented site fronted by a custom isometric illustration of a workspace (complete with a cartoon dog nodding to the "craftz.dog" domain) — solo work on Inkdrop since 2016 distilled into a dated bio timeline, a 200k-subscriber YouTube channel, and a newsletter signup, all on one scroll.
Location
Osaka, Japan
Companies
Credentials
- Master's Program, Graduate School of Information Science, Nara Institute of Science and Technology (completed 2010)
Skills
Notable
- YouTube channel 'Dev as Life' with 200k+ subscribers
- Creator of Inkdrop, a Markdown note-taking app
What makes it work
A breakdown of the choices that make this portfolio stand out.
A custom isometric illustration as the entire hero
Instead of a headshot or a product screenshot, the top of the page is a warm, hand-styled 3D-isometric illustration of a desk, laptop, and a dog — a visual pun on the craftz.dog domain. It's more distinctive and more shareable than a stock photo, and it signals design sensibility before a single word of bio is read.
A dated bio formatted like a changelog
The "Bio" section reads 1984 — Born in Osaka / 2010 — Master's degree / 2010 — Joined Yahoo! Japan / 2012–present — Freelance, laid out as a scannable timeline rather than a paragraph. Career facts formatted like version history are faster to scan and harder to embellish than prose.
Products and audience proven with two concrete cards
Two cards sit side by side near the bottom: a YouTube thumbnail for "Dev as Life" (200k+ subscribers) and a screenshot of Inkdrop, the Markdown app he has sold solo since 2016. Two real, linkable, checkable things do more work than a paragraph describing "content creation and product development."
A single mint-teal accent against near-black, used sparingly
The "My portfolio" button and a handful of links are the only splashes of teal against an otherwise dark charcoal background. Restricting an accent color to interactive elements — the same discipline seen on brittanychiang.com — keeps a dark theme from feeling flat or busy.
What Full Stack Developers can take from this
Specific, actionable tips to apply to your own portfolio — no generic advice.
A single custom illustration (even a simple isometric scene) at the top of your page outperforms a stock photo or generic hero banner for memorability.
Format your bio as a dated timeline instead of a paragraph when your career has clear, checkable milestones — it reads faster and it's harder to fudge.
Link to two or three real, concrete things (a YouTube channel with a sub count, a shipped product) rather than describing your work in the abstract.
If you go dark-themed, pick one accent color and use it only for things people can click — buttons, links, icons.
A newsletter signup at the bottom of a personal site, after the reader already trusts you, converts far better than a popup on arrival.
Projects
Inkdrop leads, but Takuya Matsuyama's Works page goes back further: walknote, a music-recommendation app that reached 130,000+ users before closing, and Menkiki, an iOS app that ran on-device deep learning in 2015. Solo products all the way down.
Inkdrop — Markdown Note-Taking App
A cross-platform Markdown note-taking app for Windows, macOS, Linux, iOS, and Android, with 100+ plugins and encrypted data sync. Built on Node.js, Electron, and React Native, and run by Takuya Matsuyama since 2016. His homepage says he currently lives off it.
A paid product on five platforms that one developer has kept alive since 2016 covers architecture, sync, desktop and mobile shipping, pricing, and marketing. That's evidence of end-to-end ownership that no tutorial project provides.
Five platforms from one developer: Windows, macOS, Linux, iOS, Android
$300k+ lifetime revenue on a $5/mo product, a stated number rather than a vague 'successful SaaS'
100+ plugins show an extensible core that other people build on
Marketing is part of the build: blog posts, YouTube, newsletter
walknote — Music Recommendation App for iOS
An iOS app that recognised the songs already on your device and recommended new music you might like, which you could then play like a radio. Built with Objective-C on the client and PHP and MongoDB on the server, and covered by several Japanese app-review sites including AppBank.
A consumer app that reached six figures of users, then was wound down in public, shows the full product lifecycle, including knowing when to stop. It came before Inkdrop and helps explain how the later product was built.
130,000+ registered users over five years
Full stack before the term was fashionable: native iOS client plus PHP/MongoDB backend
Honest ending: the shutdown is listed with the same prominence as the launch
An iOS app that suggests ramen shops from a photo of the ramen you want to eat, with no Japanese keywords needed. It covers 900+ well-known ramen shops in Japan, shows shops near your current location, and opens them in Tabelog or Foursquare. Recognition runs a CaffeNet deep-learning model on-device, and he open-sourced the Caffe-on-iOS setup as caffe-ios-sample.
On-device image recognition in a 2015 iOS app is early, practical ML. It shows he could take a research model, get it running on a phone, and wrap a simple consumer use case around it.
Photo in, ramen shop out: a clear consumer use case for image classification
900+ shops covered, with location-aware results and Tabelog/Foursquare hand-off
Open-sourced the hard part (Caffe on iOS) and turned it into conference talks
craftz.dog — Open-Source Homepage with a Three.js Hero
Takuya Matsuyama's personal homepage: a 3D workspace scene rendered with Three.js at the top, a dated bio timeline, and a Works section. The site's own nav links to the source (Next.js, Chakra UI, Three.js, Framer Motion), and the README links a YouTube video of how it was built.
Open-sourcing your own portfolio and filming how you built it turns a personal site into teaching material. The commit history shows real performance work on the 3D assets.
3D hero in Three.js, with the GLTF model optimised using Draco compression
Source linked from the site's own nav: 'Source' sits next to Works and Posts
Paired with a build-along YouTube video, so the site doubles as content
More Full Stack Developer portfolios
Ready to build your portfolio?
Follow the Full Stack Developer roadmap — skills, projects, and timeline to get hired.