👋 Aloha, this is where you can grab most of my tech doodles and sketchnotes.
I have been posting my tech doodles on Twitter and Microsoft open-source projects. I am repeatedly asked where to get the original images, especially from people who saw some of my works out of context on some social media, so I decided to put them all together on one GitHub repo.
Here are some of the latest digitally created hand-drawn doodles, as well as photos of analog ones.
All my doodles are under Creative a Commons license, so please share with attributions. And I definitely don't want you to NFT them without my permission (and I won't permit you because you don't own them. They are open-sourced to be freely available for educational purpose only!)
Enjoy 🌺
└── 📁misc
└── 📁png
├── 📄chatgpt.png
├── 📄GenAI-doodle-youtube.png
└── 📄...
- ChatGPT - Added in Feb, 2023
- Doodle-to-Code YouTube series on GenAI
- Generative AI and prompting 101
- Build Clippy for Teams with Azure OpenAI and Teams AI Library
- Use OpenAI Assistants API to build your own cooking advisor bot on Teams
└── 📁algorithms
├── 📁images
│ ├── 📄algorithm101_file.webp
│ └── 📄...
└── 📁pdf
├── 📄algorithm101_file.pdf
└── 📄...
- Big O Notation: O(n)
- Big O Natation: O(1) and O(n²)
- Data Structures: Array
- Data Structures: Linked List
- Data Structures: Stack
- Data Structures: Queue
- Data Structures: Hash Table (1/2)
- Data Structures: Hash Table (2/2)
- Data Structures: Binary Heap (1/2)
- Data Structures: Binary Heap (2/2)
- Data Structures: Binary Search Tree (1/2)
- Data Structures: Binary Search Tree (2/2)
These images are created for the project at Microsoft I was in, Web Dev for Beginners curriculum.
└── 📁webdev
├── 📁images
│ ├── webdev101-programmingml-history.webp
│ └── 📄...
└── 📁pdf
├── 📄webdev101-programming.pdf
└── 📄...
- Introduction to Programming Languages and Tools of the Trade
- Introduction to GitHub
- Creating Accessible Webpages
- JavaScript Basics: Data Types
- JavaScript Basics: Methods and Functions
- JavaScript Basics: Making Decisions
- JavaScript Basics: Arrays and Loops
- Introduction to HTML
- Introduction to CSS
- DOM Manipulation and a Closure
These images are created for another project at Microsoft I was in, Machine Learning for Beginners curriculum.
└── 📁ml
├── 📁images
│ ├── 📄ml-history.webp
│ └── 📄...
└── 📁pdf
├── 📄ml-history.pdf
└── 📄...
- Machine Learning history
- Faireness in ML
- Regression
- Reinforcement
- Time series
- ML in the real world
This series is my earlier work and everything is drawn in very analog way.
I am planning to recreate digitally someday. Git cherrypick is the only one that digitally handdrawn after I got an iPad with Pencil.
└── 📁git-purr
├── 📄git-purr.webp
└── 📄...
- git purr (git pull)
- git meowge (git merge & git rebase)
- git puss (git push)
- git cherry-pick & git log
└── 📁teams
├── 📄teams-toolkit-v3-doodle.webp
└── 📄...
- What's New in Teams Toolkit v3
These are some of my old sketchnotes from the past. I don't have all of my drawings but post as I find somewhere in my HD or cloud spaces.
└── 📁sketchnotes
└── 📄...
This is one of my first personal projects to make technology into cats. Although this is not doodling, I thought it was worth mentioning here!
All HTTP Cats are now hosted at HTTP.cat because the domain name is awesome.
All images (except a few) are originally created by me a decade ago! Read the story on Know Your Meme
└── 📁slack
└── 📄...
These are something I did while working at Slack. I created the zine (as physical printed books) to be distributed at Slack-sponsored events and conferences but never got fully approved. The global pandemic forced us to give up all in-person events anyway.
The content is outdated as of 2022 so view them with cautions.
This work is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.
