Outside the box

Capture the thought. Sleep on it.

Comment

Inspiration

Outside the Box came from a problem I experience personally.

Some of my best ideas arrive when I am trying to sleep thats wgy the app is called outside the box. It could be a business idea, a creative concept, an important reminder, or the solution to a problem I had been thinking about earlier.

The obvious reaction is to grab my phone and write the thought down. But as soon as I look at the screen, I see the time.

3:47 AM.

Then I stop thinking about the idea and start calculating how many hours of sleep I have left. A thought that should take a few seconds to capture can turn into another reason to stay awake.

I wanted to create an experience where someone could save a thought without being reminded of the time or pulled into the rest of their phone.

That became the core idea behind Outside the Box:

Capture the thought. Don’t see the time.

What it does

Outside the Box is a mobile-first nighttime thought-capture app designed to be opened before the user goes to sleep.

The user opens the app, places the phone beside the bed, and leaves the app running. The interface becomes almost completely black, contains no visible clock, and is designed to make the phone feel as though the screen is switched off.

When a thought appears during the night, the user can pick up the phone and immediately return to the same dark interface instead of opening a bright notes app, seeing the time, or becoming distracted by notifications and other apps.

The nighttime experience is intentionally minimal:

  • an almost completely black screen
  • no clock displayed inside the app
  • no menus or distracting navigation
  • one tap to begin capturing a thought
  • a short and quiet confirmation after saving
  • an immediate return to darkness

The app cannot remove the iPhone or Android system clock from the lock screen. Instead, the intended experience is for the user to open Outside the Box before sleeping and leave it open. While the app remains on screen, its dark interface hides time information and feels almost like the phone is off.

The user writes the thought exactly as it arrived and saves it. Once it is captured, they can put the phone back down without needing to organize, develop, or continue thinking about it.

In the morning, the thought appears in a warmer and clearer interface. The original wording is always preserved, while AI creates:

  • a short and meaningful title
  • a clearer version of the original thought
  • one practical next step

The purpose is not to make people productive in the middle of the night.

The purpose is to give the brain permission to let go of the thought because it has been safely captured for tomorrow.

How I built it

I built Outside the Box as a mobile-first web application using:

  • Next.js
  • React
  • TypeScript
  • Tailwind CSS
  • OpenAI Responses API
  • Structured Outputs
  • Zod validation
  • browser localStorage
  • GitHub
  • Vercel
  • Codex

I started by defining the complete user journey:

  1. The user opens the app before going to sleep.
  2. The app displays a nearly black resting screen with no visible clock.
  3. The user taps the screen when a thought appears.
  4. A minimal writing interface opens.
  5. The original thought is saved locally.
  6. The app returns to darkness.
  7. In the morning, AI organizes the thought into a useful result.

I built the interface around three main states:

Night state

The night state acts as the resting screen. It is deliberately dark and minimal so the phone feels inactive while the app remains open beside the user.

Capture state

When the user taps the screen, a simple text field appears. There are no categories, folders, dashboards, or unnecessary decisions. The user only needs to write the thought and save it.

Morning state

The morning state presents the original thought alongside the AI-organized result in a warmer and more readable interface.

The original thought is saved to localStorage before the AI request is made. This means the user’s words remain available even if the internet connection fails or the OpenAI request cannot be completed.

The saved thought is then sent to a server-side API route. The server calls the OpenAI Responses API and requests a predictable structured result:

{
  title: string;
  cleanedUpThought: string;
  oneNextStep: string;
}

I used Structured Outputs and Zod validation to ensure the response always follows the format expected by the interface.
The organizer prompt instructs the AI to:
preserve the meaning of the original thought
preserve genuine uncertainty
avoid inventing details
remove unnecessary filler
create a concise title
provide only one realistic next step
The OpenAI API key is stored as a server-side environment variable. It is never included in the browser code or exposed to the user.
The current prototype does not require an account or cloud database. The latest thought and its organized result are stored locally on the user’s device.
I used GitHub to store the source code and track changes to the project. I connected the GitHub repository to Vercel, which builds and hosts the public version of the application.
Codex helped me throughout the development process. I used it to:
scaffold the Next.js project
create the mobile-first interface
implement the different application states
build the local storage system
create the server-side API route
connect the OpenAI API
add structured validation
fix development and build errors
test the production build
improve the project documentation
I still made the main product decisions myself, including the concept, user flow, visual direction, nighttime experience, AI output format, and which features to leave out of the prototype.
Challenges I ran into
One of the biggest challenges was working within the restrictions of modern phones.
A third-party app cannot replace the phone’s lock screen, remove the system clock, or allow normal typing while the device is locked. Because of this, I had to design a realistic alternative.
The solution was to make Outside the Box an app the user opens before sleeping and leaves running. Its dark resting screen contains no clock and is designed to resemble a switched-off phone. This preserves the main emotional benefit of the idea without claiming to bypass the operating system.
Another challenge was balancing the real nighttime experience with the requirements of a hackathon demonstration.
In the real product, the ideal flow is:
Save the thought, return to darkness, and look at it in the morning.

However, judges need to see the AI result immediately. I therefore included a way to demonstrate the morning view without requiring someone to wait until the next day.
Another major challenge was making the AI useful without allowing it to take over the product.
Early versions sometimes produced titles that were too literal or next steps that felt generic. I tested the organizer using different types of thoughts, including:
business ideas
creative concepts
reminders
decisions
worries
unfinished questions
random nighttime thoughts
I refined the prompt so the AI clarifies the thought without exaggerating it, changing its meaning, or pretending every idea is brilliant.
I also ran into several technical challenges while building the project on Windows, including:
installing and running Node.js
using Codex through the terminal
dealing with PowerShell execution restrictions
managing multiple copies of the project
moving the project away from OneDrive
learning Git and GitHub
protecting the API key
configuring environment variables
deploying the application through Vercel
confirming that the live production version worked correctly
Solving these problems taught me how the complete development and deployment process works, rather than only how to design the visible interface.
Accomplishments that I’m proud of
I am proud that I turned Outside the Box from a personal problem into a functioning and publicly accessible product.
The prototype now includes:
a complete night-to-morning experience
a dark resting screen designed to feel like the phone is off
a distraction-free thought-capture interface
preservation of the user’s exact original words
real server-side OpenAI integration
structured and validated AI output
local privacy-focused storage
error handling for failed AI requests
a public production deployment
a GitHub repository with the project source code
I am especially proud that AI does not feel like the entire product.
The AI works quietly in the background and becomes useful in the morning. The most important part of the product is still the moment when the user realizes:
I saved it. I no longer have to keep thinking about it tonight.

I also built and deployed the prototype in a very short period despite having limited previous experience with several parts of the technology stack.
What I learned
The biggest lesson I learned was that AI should not automatically become the headline of an AI-powered product.
The real value of Outside the Box is not simply that it summarizes text. Its value comes from understanding a specific moment: someone is tired, a thought suddenly feels important, and they are afraid they will forget it.
AI becomes valuable later, when it helps the user understand the rough thought in the morning.
I also learned that restraint can be a feature.
It would have been easy to add accounts, folders, dashboards, categories, social features, complicated settings, and many different AI tools. However, those features would have weakened the main experience.
Instead, I focused on one complete flow:
A thought appears → it is captured → the app returns to darkness → the thought becomes clearer in the morning.

I learned how important it is to preserve the original user input. AI should enhance the thought, not replace it. That is why the original nighttime wording is always shown alongside the organized version.
Technically, I learned how to:
build a full application with Next.js and TypeScript
create server-side API routes
work with the OpenAI Responses API
use Structured Outputs
validate AI responses with Zod
store data locally in the browser
protect secrets with environment variables
use Git and GitHub
deploy a production application with Vercel
use Codex as a development partner while maintaining control over the product direction
What’s next for Outside the Box
The Build Week version proves the core idea, but I want to continue developing Outside the Box into a native mobile application.
The next version could include:
a Morning Inbox containing multiple thoughts
silent text capture
whisper-based voice capture
dream journaling
a private thought history
Face ID or biometric protection
Apple Watch capture
optional reminders to review saved thoughts
exports to notes and productivity tools
deeper AI development for selected ideas
personalized organization based on the user’s thought patterns
A native version could also use screen-dimming features and carefully designed device settings to make the nighttime experience even darker and less disruptive.
The intended bedtime routine would remain simple:
Open Outside the Box before sleeping.
Leave the dark resting screen open beside the bed.
Capture a thought when it appears.
Return the phone to darkness.
Review the organized thought in the morning.
The long-term vision is for Outside the Box to become a private second brain for thoughts that arrive outside normal hours.
A place for ideas, dreams, reminders, worries, solutions, and creative breakthroughs that appear when the conscious mind becomes quiet.
Phones usually interrupt sleep.
Outside the Box is designed to capture the thought and let the night continue.

Built With

  • ai
  • api
  • app
  • capture
  • codex
  • css
  • github
  • gpt
  • hackathon
  • idea
  • local
  • mental
  • next.js
  • outputs
  • privacy
  • productivity
  • react
  • responses
  • sleep
  • tailwind
  • typescript
  • vercel
  • web
  • zod
Share this project:

Updates