The Writing Suggestions System helps users overcome the blank page problem by providing curated title suggestions with corresponding placeholder text. This feature is designed to inspire users and provide starting points for their writing.
- 250 Diverse Suggestions: Carefully curated list of page titles across multiple categories
- Custom Placeholders: Each suggestion has tailored placeholder text to guide writing
- Collapsible Banner: Unobtrusive collapsed state that expands on demand
- Horizontal Scrolling: Three-row carousel layout for efficient browsing
- Pagination: Load suggestions in batches of 50 for performance
- One-Click Title Filling: Instantly populates title and placeholder text
Location: app/components/writing/WritingSuggestionsBanner.tsx
Main component that handles the suggestion interface:
- Collapsible banner with expand/collapse functionality
- Horizontal scrolling carousel with navigation arrows
- Batch loading with "Load 50 more" button
- Three-row layout for optimal space usage
Location: app/data/writingSuggestions.ts
Contains the complete dataset of suggestions:
- 250 curated title suggestions
- Corresponding placeholder text for each suggestion
- Helper functions for batch loading
- Type definitions for suggestion objects
Location: app/new/page.tsx
The banner is integrated into the page creation flow:
- Positioned below content editor and above date/location fields
- Only shown when in editing mode
- Handles suggestion selection and form population
interface WritingSuggestion {
title: string; // The suggested page title
placeholder: string; // Custom placeholder text for the editor
}{ title: "Coffee Shops", placeholder: "Write about your favorite coffee shops..." }
{ title: "Travel Destinations", placeholder: "Write about places you want to visit..." }
{ title: "Life Lessons", placeholder: "Document important lessons you've learned..." }The 250 suggestions are organized across diverse categories:
- Coffee Shops, Pizza Places, Breakfast Spots, Food Trucks, etc.
- Travel Destinations, Hidden Gems, National Parks, City Guides, etc.
- Movies, TV Shows, Books, Podcasts, Music Albums, etc.
- Daily Routines, Productivity Tips, Life Lessons, Goals, etc.
- Photography, Gardening, Crafts, Sports, Fitness, etc.
- Apps, Websites, Software, Gadgets, Online Tools, etc.
- Products, Brands, Shopping Lists, Gift Ideas, etc.
- Skills, Courses, Languages, Tutorials, Study Tips, etc.
- Healthy Recipes, Workout Routines, Mental Health, etc.
- Career Advice, Job Search, Networking, Skills Development, etc.
- Home Organization, Interior Design, Cleaning Tips, etc.
- Friendship, Family, Communication, Social Events, etc.
- Art Projects, Writing, Music, Drawing, Painting, etc.
- Wildlife, Weather, Seasons, Outdoor Activities, etc.
- Cars, Public Transportation, Bicycles, Walking, etc.
- Budgeting, Saving Tips, Investments, Financial Goals, etc.
- Holiday Traditions, Seasonal Activities, Gift Giving, etc.
- Life Hacks, Random Thoughts, Observations, Questions, etc.
- Bucket List, Wish List, Favorites, Recommendations, etc.
- Shows "Not sure what to write about?" with chevron down icon
- Styled as dashed border card to indicate interactivity
- Hover effect provides visual feedback
- Changes title to "Here are some ideas..."
- Shows X button for collapsing
- Displays three rows of suggestion pills
- Horizontal scrolling with navigation arrows
- "Load 50 more" button when reaching end of current batch
- Clicking any suggestion pill:
- Fills the page title field
- Updates the content editor placeholder text
- Automatically collapses the banner
- Clears any existing title validation errors
- Initial load: First 50 suggestions
- Subsequent loads: 50 suggestions per batch
- Total available: 250 suggestions
- Prevents UI lag with large datasets
- Hidden scrollbars for clean appearance
- Smooth scrolling behavior
- Arrow navigation for accessibility
- Responsive to container resize
- All buttons are keyboard accessible
- Proper focus management
- Screen reader friendly labels
- High contrast button styling
- Clear visual hierarchy
- Responsive layout for mobile devices
- Personalization: Learn from user's previous page topics
- Search: Allow users to search within suggestions
- Categories: Filter suggestions by category
- Custom Suggestions: Allow users to add their own suggestions
- Analytics: Track which suggestions are most popular
- Seasonal: Rotate suggestions based on time of year
- Consider moving suggestions to database for dynamic updates
- Add suggestion analytics and usage tracking
- Implement suggestion rating system
- Add localization support for different languages
- Edit
app/data/writingSuggestions.ts - Add new suggestion objects with title and placeholder
- Ensure suggestions are appropriate and diverse
- Update total count in documentation
- Maintain balance across categories
- Ensure suggestions appeal to broad audience
- Keep titles concise (1-3 words typically)
- Make placeholders specific and inspiring
Last Updated: August 16, 2025
Version: 1.0
Status: Production Ready