A reference-management workspace for creative professionals.
TOOLS
Figma · Claude Code · ChatGPT · VSCode · Canva · Aftereffects · Vercel · Procreate
Overview
INDUSTRY
Digital Product Design,
AI-Assisted Creative Tools
CONTRIBUTORS
Anushka, Sneha K, Nila
DURATION
3 weeks
PROJECT TYPE
Passion project
ROLE
UX/UI Design
Prototyping,
Vibe Coding
Where do your references go when you find them?
We have endless ways to collect inspiration, but very few ways to make sense of it.
Context
Notion - added to a page
Pinterest - saved to boards
Camera roll - screenshot
WhatsApp - sent to yourself
Notion - added to a page
Browser - Bookmarked
Behance - saved for later
FigJam - Creating a board
The Spark
The idea for my. Nook emerged while I was putting together my own portfolio. I found myself collecting references across Pinterest, Behance, browser bookmarks, screenshots, and Notion, with no single space to bring them together meaningfully. I initially explored using FigJam to create a central reference board, but constantly switching between platforms to find, organise, and update references made the process feel fragmented.
This led us to envision a dedicated workspace that combined the inspiration-discovery experience of Pinterest and Behance with the flexible canvas and organisational capabilities of FigJam and Figma. As we explored the concept further, we saw an opportunity to go beyond simply collecting and organising references: what if the visual context behind a board could be preserved, shared with clients, and carried directly into AI-assisted building?
This evolved into my.Nook, a reference-management workspace that connects inspiration, curation, collaboration, and creation in one place.
WHERE IT BEGAN
At a Glance
My.Nook.
My.Nook. is a reference-management workspace for creative professionals. It brings references into project-specific spaces where they can be captured, organised, curated, understood, and handed off to clients, carried into the design process, or used as a foundation for vibe coding. The board isn’t just something you browse—it’s something you can hand off.
WHAT IT DOES
Organise
Turn a pile of references into a structured project.
UI/UX Reference
30 items · Updated 1d ago
Freelance Project 1
11 items · Updated 3d ago
References
Projects
Portfolio
Personal
Capture
From anywhere, without losing the source.
Save to my.Nook
Curate
Turn a collection of references into a clear direction.
BOARD BRIEF
Mood
Minimal
Editorial
Palette
Typography
Montserrat / Serif
Build
Export your boards directly to any AI tool to iterate and build.
SEND TO
Claude
VS Code
Codex
Loveable
Primary Research
Primary Research
GOAL
USERS
To understand how creative professionals collect, organise, and use visual references, and uncover the gaps in turning scattered inspiration into a clear, usable direction.
Creative professionals who work through references.
UI/UX & Web Designers
Illustrators & Art Directors
Freelancers & Small Studios
Vibe Coders
METHOD
5 Semi-structured interviews
“References become useful when translated into rough cuts, diagrams, or quick prototypes rather than simply stored. I try to preserve the context behind references and make them easier to retrieve and use when needed”
Rhea Sudesh | Prev. Developer | Marketer |
Confluence by Atlassian
Figma/ Figjam
“I use it for both photos and links. I write down why I chose that ref and the text is hyperlinked.”
“I like having refs in the same file as the designs, easier to show and explain your thoughts to people that way too”
Sowparni | UI/ UX Designer
“ Notion for when I need to segregate my references for different classes or topics. Mostly for academic papers I save a lot of links and videos, this makes organisation easier.”
Yashtika | Student
Notion
“ When its not urgent, I use my whatsapp profile to store everything. If I need it I copy paste it onto my figjam or Miro. “
“Sometimes to share the consolidated final references to clients I use docs, mostly everyone has it and it’s synced, so it makes it easier to access. At a glance I can see how many references of what category I’ve shared.”
Sreesha | Designer
Whatsapp, Google Docs
Product Position Map
Mapping the current inspiration-to-build workflow.
What’s missing is one place where references can be curated into a meaningful, usable collection.
We followed an inductive reasoning approach, beginning with my personal experience of struggling to manage scattered visual references while building my portfolio. Through primary research with creative professionals, we identified recurring patterns in how references were collected, organised, and shared, and the challenges of preserving their context. These observations helped us derive key insights, identify an unmet need, and conceptualise my.Nook as a workspace that connects inspiration, curation, collaboration, and building.
Use Case Scenario
Client handoff: Sharing a curated reference board with clients.
Claude Code handoff: Transfer the same visual context directly into Claude Code for building.
The designer struggles to keep track of visual references collected from different sources.
Multiple calls are needed to clarify the design direction, with both the designer and client struggling to align.
Repeated discussions and scattered references slow down the workflow, costing time and resources.
She attempts to bring all her references together into a single board, but struggles to create a clear visual direction.
The client finds the board confusing because it doesn't reflect the intended direction, and the annotations create further ambiguity.
The designer is building her portfolio website and struggles to keep track of visual references scattered across different sources.
Despite multiple iterations, the website still fails to match the visual direction she had envisioned.
The repeated back-and-forth between references, prompts, and generated outputs slows down the process and makes it difficult to achieve a cohesive design.
She struggles to translate her varied visual references into a descriptive prompt that captures her intended design direction.
The generated website fails to reflect her references, forcing her to add individual images and instructions repeatedly.
Concept Ideation
I explored five interface directions for my.Nook to understand how creative professionals could navigate, organise, and revisit their visual references. Each concept experiments with a different spatial and organisational model, balancing discoverability, structure, and creative freedom.
These explorations helped me compare structured navigation models with more fluid, visual approaches. For my.Nook, the key consideration was finding a balance between easy retrieval, project-based organisation, and the freedom to curate references visually.
How quickly users can locate a specific board or reference?
How to make collections easier
to scan & retrieve?
Clear structure and predictable retrieval.
Information Architecture
User flow
Low Fidelity
We began by sketching out the wireframes to understand the basic structure and flow.
From there, we translated those ideas into
low-fidelity prototypes to explore how the experience would come together.
These early iterations helped us test the flow, hierarchy, and interactions before moving into visual design.
Branding
Brand Guideline
my.Nook
VISUAL RESEARCH, ORGANISED
my.Nook
TYPOGRAPHY
Aa
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
Londrina Solid — logo only
Aa
ABCDEFGHIJKLMNOPQRSTUVWXYZ
abcdefghijklmnopqrstuvwxyz
Libre Franklin — every interface style
COLOUR PALETTE
#FE4C02
#FFE1D5
#000000
#5C5C5C
#F2F2F2
GRAPHIC ELEMENTS
MOODBOARD
Home / All Boards
Board Detail
Grain Texture
AI Handoff — Export
Sidebar & Icons
Specific Boards
Key interactions in boards
A dedicated space to refine each collection by adding references, applying tags, marking essentials, and building a cohesive visual direction.
Comments & Collaboration: Users can leave feedback on individual references, discuss design choices with collaborators, and resolve comments to keep feedback organised within the board.
Share Board: Users can share the entire board or essential references with selected team members, manage collaboration access, and invite new collaborators via email.
Selection & Marking Essential: Users can select multiple references at once and mark key visuals as essential, making it easier to prioritise important references during AI handoff.
Key interactions in Home
A central workspace to view, search, and navigate all your reference boards across projects, disciplines, and personal interests.
/Filter
/Sort
/Tag
/Create new board
Home — All Boards
Introducing my.Nook
my.Nook
From every Nook & Corner, to one place.
Onboarding with my.Nook
Introduce users to my.Nook’s features and guide them in setting up their workspace. Users learn to collect and curate references to share with clients.
Users can send their curated boards, references, and design context directly to their preferred AI tool to turn visual inspiration into actionable prompts and build-ready outputs.
Send to AI
Steps involved
AI Hand-Off: Users review the references, mood, colour palette, typography, and visual direction selected for their board.
Send to AI: Users choose their preferred AI tool, define the scope of references to share, review their board’s visual direction, and generate or refine a structured prompt aligned with their design intent.
Send to AI: Users choose their preferred AI tool and select whether to send the entire board or only essential references.
AI-Powered Workflows
AI Integrations: Lets users connect and manage AI tools such as Claude, Cursor, Antigravity, Lovable, and ChatGPT to send curated references, context, and boards directly into their AI workflows.
AI Integrations: Lets users connect and manage AI tools such as Claude, Cursor, Antigravity, Lovable, and ChatGPT to send curated references, context, and boards directly into their AI workflows.
my.Nook Assistant: An AI-powered assistant that helps users analyse and auto-tag references, explore saved content, understand boards, and extract visual language from their collections.
Seamless Collaboration
Shared with Me: Enables users to discover shared boards and reference collections, manage collaboration invitations, and access projects with assigned permissions.
Team & Workspace Management: Allows users to invite team members, manage roles and permissions, monitor workspace usage, and control which AI tools are available to the team.
User Testing
We tested the working product with
15 participants across 7 disciplines to understand how well my.Nook fits into their creative workflow.
User Testing
We tested my.Nook through 3 core tasks:
1. Organising references
2. Sharing boards with clients
3. Initiating an AI-assisted build.
The sessions assessed task completion and discoverability, showing my.Nook's support for creative workflows.
15/users
100%
73% (11/15)
Participants tested
Completed core workflow
Found actions independently
Across 7 creative disciplines including UI/UX, industrial design, fashion, marketing and more.
All 15 participants were able to complete the main tasks.
73% of users reported they could find the actions they needed without help.
4.5/5
4.1/5
Workflow relevance
Overall usability rating
Every tester agreed they could see my.Nook fitting into their actual workflow (average 4.5/5).
Average rating across 6 key aspects of the experience.
KEY TAKEAWAYS
01
02
03
Users loved having references, context and
AI tools in one workspace.
The sharing flow and board structure were easy to understand.
Navigation and action discoverability are key areas to improve.
Learning Outcomes
Through this project, I gained hands-on experience in AI-assisted development, translating design intent into a working product, and validating the experience through user testing.
KEY TAKEAWAYS
01
Translating Design into a Functional Product
02
Prompting & AI Collaboration
03
Iterative Development & Debugging
04
User-Centred Validation
SKILLS GAINED
01
AI-Assisted Development
02
Prompt Engineering
03
Code Review & Debugging
04
Deployment & Integration
Future Scope
Deeper AI Integrations
Live AI Handoff
Beta Testing
Explore synchronised handoffs that keep boards and their context updated as designers refine their references.
Enable direct transfer of references, design context, and structured prompts into AI building tools, reducing manual handoff.
Refine discoverability and usability through further testing, then expand access to a wider group of designers.
COMMON PATTERNS
Decoding user patterns through primary research and developing a deeper understanding of their needs.
Visual thinkers who use references to explore ideas, define creative direction, and bring concepts to life. It supports designers and AI-assisted creators by bringing visual inspiration, design context, and AI tools into one workspace.
Who is it for?
UI/UX & Product Designers
Visual & Graphic Designers
Developers & Vibe Coders
Freelance Designers & Creative Professionals
AI-Assisted Creators
O1
O3
O2
How might we turn scattered inspiration into clear, sharable reference boards that carry creative intent into the design and building process?
Organising Inspiration
How might we help creatives bring
referenced from different sources
into one coherent workspace?
Bridging inspiration and creation
How might we carry visual direction into AI-assisted building without losing the original intent?
Preserving creative intent
How might we help creatives communicate the context and thinking behind their visual references?
Key Insights
01
References are saved faster than they are understood.
02
Inspiration is scattered across personal workflows.
03
Moving from inspiration to execution creates friction.
04
Sharing references still requires manual explanation.
The Gap
Existing tools help designers save and store references, but don’t help them build a shared understanding around those references. There is a gap between collecting inspiration and turning it into a clear, contextual, and transferable creative direction.
GUIDING QUESTION
x
Dribbble
Ways to add references
CAPTURE
CAPTURE
CAPTURE
Through Browser Extension
The extension allows users to capture inspiration from any website and save it to a board or the Unsorted collection.
Capture inspiration from anywhere and bring it all into my.Nook.
From your desktop into my.Nook
ADD
Through in-app “Add Reference”
Add references by pasting links or uploading images, then tag them with keywords to preserve their context and make them easier to organise and retrieve.
Bring every reference together in one workspace, ready to organise, explore, and create.
My Role in Building my.Nook
UX Design & Visual design:
Designed core screens, user flows, UI design language & visual system.
Code Review & Debugging:
Reviewed outputs, prompted corrections, and refined implementations.
Development:
Iteratively validated and refined the product alongside Claude Code.
Value Created
Connected visual references, project context, and AI-assisted building within a single workflow.
Bridged the gap between gathering inspiration and turning it into tangible outcomes.
Helped designers carry their visual direction into the website-building process.
Validated the core workflow with 15 participants, across various disciplines, achieving an average workflow-fit rating of 4.5/5.
Room to Evolve
Make the transition from collecting references to initiating an AI handoff more seamless.
Improve organisation and navigation as reference collections and boards grow.
Make handoff status and previously shared context easier to access.
Evaluate the experience through longer-term use on real-world design projects.
my.Nook is currently in the prototype and early-validation stage. Testing with 15 participants across 7 disciplines showed promising workflow relevance, with all participants completing the core tasks. Feedback highlighted the value of bringing visual references, design context, and AI-assisted building into one workspace. The next step is to refine discoverability and the AI handoff experience based on user feedback before moving towards a wider beta.
Validation & Next Steps
Anchor
Making online play safer for children.
Next Projects
The Gaana Corner
Connecting people through Gaana culture.
References are collected across multiple platforms, tools, and folders, making it difficult to preserve context, communicate visual intent, and carry ideas into the creation process.
PROBLEM
my.Nook is a visual workspace that helps creative professionals collect, organise, and contextualise references, collaborate with others, and seamlessly hand off their visual direction to AI tools to turn ideas into tangible outcomes.
SOLUTION
Creative professionals struggle to organise scattered visual references and translate their inspiration into actionable design direction.
Bringing inspiration, context, and AI-assisted creation together in one connected workspace.