Case Study — AI Application

Notelify Study Smarter.

An AI-powered note-taking app designed to help students write, refine, and study their notes more effectively — with intelligence woven throughout the entire workflow.

Note

The interactive demo reflects the version evaluated during user testing. A redesigned iteration is currently in active development and not yet publicly available.

View Live Demo Explore the Build
Team
Kanishka & Sauhee
Type
UX Case Study
Stack
Claude AI + Web
NOTELIFY
Notelify App
01Note Mode
02Overview Mode
03AI Assistant
04Adaptive Learning
055 User Sessions
06Think-Aloud Protocol
077 Redesign Decisions
08Accessibility-First
09Claude AI · Co-Dev
103 Study Scenarios
01Note Mode
02Overview Mode
03AI Assistant
04Adaptive Learning
055 User Sessions
06Think-Aloud Protocol
077 Redesign Decisions
08Accessibility-First
09Claude AI · Co-Dev
103 Study Scenarios
Overview
01
2
Primary modes — Note Mode for capturing ideas, Overview Mode for active recall and study
5
User study participants using a think-aloud protocol across three realistic study scenarios
3→
Major AI interaction types: Explain Clearly, List Examples, and Refine Text, available via text highlight
∞
Adaptive prioritization — sections revisited most frequently surface first during study sessions

Notes that teach you back

Most digital note tools are just storage. Notelify is built on the idea that reviewing and refining notes is the studying — and AI should be woven throughout, not bolted on.

Features
02

Designed for how students actually study

Before · V1
Notelify Version 1
01 —
Note Mode
Highlight any text to trigger Explain Clearly, List Examples, or Refine Text — applied instantly.
02 —
Overview Mode
AI study questions for active recall. Surfaces sections you revisit most automatically.
03 —
Always-On AI Chat
Available in both modes. Flags questions outside your notes to stay a credible study guide.
04 —
Adaptive Priority
Sections revisited most get surfaced first in study sessions automatically.
05 —
Accessibility
Adjustable font size, dyslexia-friendly options, high-contrast mode — all more prominent after user feedback.
Notes that teach you back.
Try it live →
Design Process
03

Iterative, tested every step

Every version was tested before changes — aligning the tool with how students naturally capture ideas, then study from them.

1
Problem Framing
The gap between note-taking and studying
2
Two-Mode Structure
Capture mode separated from study mode
3
V1 Prototype
AI interactions + study questions built
4
User Study
5 participants, 3 scenarios, think-aloud
5
V2 Redesign
7 changes grounded in findings
User Testing
04

Three scenarios, real insights

01
Notes from a video
Real-time note-taking during a short video — testing AI feature discoverability during capture.
02
Learning from notes
Using Explain Clearly, refinement, and highlighting — surfacing interaction model confusion.
03
Studying in Study Mode
Switching modes and engaging with Study Assistant — revealing duplication confusion.
PraisedExplain Clearly was the standout — deeper explanations without leaving the note
IssueNo one realized highlighting was required to activate AI features
IssueSummarize sometimes produced more text than the original note section
IssueTwo AI elements created confusion about which to use and when
InsightParticipants wanted the AI available while writing — not just during study
IssueRefine Text broke bullet-point notes by applying paragraph-style rewrites
InsightEmojis felt out of place — participants wanted a more academic, focused aesthetic
PraisedAccessibility features appreciated — but needed to be more visible
NOTELIFY

"Being able to ask questions or clarify concepts during note-taking would make the system more useful in real time — not just when studying."

Participant · Scenario 2 · Think-Aloud Session
Redesign
05

Every change earned its place

Phase 1 — Initial Concept
Initial Concept

First exploration of the two-mode structure. Established Note Mode and Overview Mode as the core interaction model.

Removed
Preview & Accept
Disruptive multi-step flow. Results now apply immediately.
Removed
Summarize Feature
Generated more text than source. Removed to keep focus on comprehension.
Added
AI in Note Mode
Assistant now persists across both modes — available wherever you work.
Improved
Highlight Cues
Onboarding signals make highlight-to-activate clear from session one.
Improved
Visual Differentiation
Distinct colors separate AI actions. Emojis removed.
Improved
Bullet Point Refine
Refinement detects list format and preserves structure.
Improved
Note List UX
New notes auto-sort to top. Draggable. Toggle repositioned.
Improved
Accessibility Panel
Controls made more prominent. Dyslexia font improved.
Reflection
06

Building with AI as a partner

Low floor
Easy to start
The LLM lowered the barrier to getting started — features could be scaffolded quickly, moving from idea to prototype without deep technical expertise at every step.
High ceiling
Hard to polish
A truly polished system still required careful design decisions and human judgment. Generated code often worked technically while missing the intended user experience.
Prompting as craft
Words matter
Quality depended heavily on how clearly prompts were written. Small wording changes produced very different results — precision of intent became a skill in its own right.
Try It Yourself

See Notelify

in action.

The live demo is fully interactive. Open a note, try the slash commands, highlight some text — and ask the study assistant anything.

Note: The live demo reflects the user-tested version of Notelify. The redesigned V2 is currently in development.

Open Live Demo → Get In Touch