Eğitim Teknolojileri (EdTech)

Logic Puzzle Pro

warningProblem

"ARC-AGI-3"

psychologyPotansiyel Çözüm

ARC-AGI problem setinin zorluklarını ve potansiyelini analiz ederek, yapay zeka ve mantık bulmacaları konusunda yeteneklerini geliştirmek isteyen bireylere ve araştırmacılara yönelik bir SaaS platformu. Kullanıcılar, ARC problemlerini çözmek için algoritmalar geliştirebilir, farklı yaklaşımları test edebilir, çözümlerini paylaşabilir ve toplulukla etkileşimde bulunabilir. Platform, bireysel öğrenmeyi desteklerken aynı zamanda AGI araştırmaları için bir benchmark ve işbirliği ortamı sunmayı hedefler.

groupHedef Kitle

Yapay zeka araştırmacıları, makine öğrenmesi mühendisleri, bilgisayar bilimi öğrencileri, mantık ve algoritma bulmacalarına ilgi duyan teknoloji meraklıları. Özellikle AGI (Artificial General Intelligence) alanına ilgi duyan ve bu alandaki güncel zorlukları anlamak ve çözmek isteyen kişiler.

paymentsGelir Modeli

Freemium modeli: Temel ARC problemleri ve sınırlı test ortamı ücretsiz sunulur. Gelişmiş analiz araçları, daha fazla test süresi, özel algoritmaları saklama, rekabetçi yarışmalara katılım gibi özellikler için abonelik (Pro sürüm). Ayrıca, AGI araştırmacıları için kurumsal lisanslama seçenekleri sunulabilir.

Aksiyon Planı

ARC Problemi Çözme Aracı: Kullanıcıların verilen ARC problemlerini yükleyebilecekleri, farklı algoritmalar veya mantık kurarak çözmeye çalışabilecekleri interaktif bir arayüz.

Algoritma Geliştirme ve Test Ortamı: Kullanıcıların kendi çözüm algoritmalarını (örneğin Python ile) yazabilecekleri, test edebilecekleri ve performanslarını görebilecekleri bir sandbox ortamı.

Topluluk Forumu ve Çözüm Paylaşımı: Kullanıcıların çözümlerini, yaklaşımlarını ve karşılaştıkları zorlukları tartışılabilecekleri, diğer kullanıcıların çözümlerini görebilecekleri bir forum.

Performans Takibi ve Liderlik Tablosu: Kullanıcıların çözdükleri problem sayısı, çözüm hızı ve başarı oranlarına göre sıralandığı bir liderlik tablosu.

Pazar Analizi

7.9Puan

Kaynak: Hacker Newsopen_in_new

AI Prompt

You are a senior full-stack developer tasked with building a complete, functional MVP of 'Logic Puzzle Pro' using Next.js (App Router), Tailwind CSS, and Drizzle ORM. This application is a SaaS platform designed to help users learn, solve, and collaborate on Artificial Reasoning Challenge (ARC) problems, fostering AI and logic puzzle skills.

**PROJECT OVERVIEW:**
Logic Puzzle Pro aims to democratize access to and understanding of complex AI reasoning challenges like those presented in the ARC prize. It provides a robust platform for individuals to develop, test, and share their algorithmic solutions to ARC-style puzzles. The core value proposition lies in offering an interactive learning environment, a collaborative community, and a benchmark for AI reasoning capabilities, bridging the gap between theoretical AI research and practical problem-solving.

**TECH STACK:**
- **Framework:** Next.js (App Router)
- **Language:** TypeScript
- **Styling:** Tailwind CSS
- **ORM:** Drizzle ORM with PostgreSQL (using Neon.tech or similar serverless PostgreSQL)
- **UI Components:** shadcn/ui
- **Authentication:** NextAuth.js (for email/password and potentially GitHub/Google OAuth)
- **State Management:** React Context API / Zustand (for global state)
- **Form Handling:** React Hook Form with Zod for validation
- **Database Client:** pg (for Drizzle with PostgreSQL)
- **Deployment:** Vercel
- **Additional:** date-fns for date formatting, lucide-react for icons.

**DATABASE SCHEMA (Drizzle ORM - PostgreSQL):**
```typescript
// schema.ts
import { pgTable, uuid, text, timestamp, integer, jsonb, pgEnum } from 'drizzle-orm/pg-core';
import { relations } from 'drizzle-orm';

// User table
export const users = pgTable('users', {
  id: uuid('id').primaryKey().defaultRandom(),
  name: text('name'),
  email: text('email').notNull().unique(),
  emailVerified: timestamp('emailVerified', { mode: 'date' }),
  image: text('image'),
  createdAt: timestamp('createdAt', { mode: 'date' }).defaultNow(),
  updatedAt: timestamp('updatedAt', { mode: 'date' }).defaultNow(),
});

export type User = typeof users.$inferSelectType;
export type NewUser = typeof users.$inferInsertType;

// ARC Puzzle table
export const puzzles = pgTable('puzzles', {
  id: uuid('id').primaryKey().defaultRandom(),
  title: text('title').notNull(),
  description: text('description'),
  // JSONB for storing the grid data (training and test cases)
  // Each test case is an object with 'input' and 'output' grids
  gridData: jsonb('gridData').notNull(),
  difficulty: integer('difficulty'), // e.g., 1-5
  createdAt: timestamp('createdAt', { mode: 'date' }).defaultNow(),
});

export type Puzzle = typeof puzzles.$inferSelectType;
export type NewPuzzle = typeof puzzles.$inferInsertType;

// Solution table
export const solutions = pgTable('solutions', {
  id: uuid('id').primaryKey().defaultRandom(),
  userId: uuid('userId').notNull().references(() => users.id, { onDelete: 'cascade' }),
  puzzleId: uuid('puzzleId').notNull().references(() => puzzles.id, { onDelete: 'cascade' }),
  code: text('code').notNull(), // User's submitted code/logic
  language: text('language').default('python'), // e.g., python, javascript
  isCorrect: pgEnum('isCorrect', ['pending', 'correct', 'incorrect']).default('pending'),
  submittedAt: timestamp('submittedAt', { mode: 'date' }).defaultNow(),
  executionTimeMs: integer('executionTimeMs'), // Time taken to execute the solution
  // Store generated output grid for review
  generatedOutput: jsonb('generatedOutput'),
});

export type Solution = typeof solutions.$inferSelectType;
export type NewSolution = typeof solutions.$inferInsertType;

// User relations
export const userRelations = {
  solutions: relations.many(solutions, ({ userId }) => userId),
};

// Puzzle relations
export const puzzleRelations = {
  solutions: relations.many(solutions, ({ puzzleId }) => puzzleId),
};

// Solution relations
export const solutionRelations = {
  user: relations.one(users, ({ userId }) => userId),
  puzzle: relations.one(puzzles, ({ puzzleId }) => puzzleId),
};

// Full schema definition for Drizzle client
export const schema = {
  users,
  puzzles,
  solutions,
};

```

**CORE FEATURES & USER FLOW:**

1.  **User Authentication:**
    *   **Flow:** User lands on the homepage. Clicks 'Sign In'/'Sign Up'. Redirected to a dedicated auth page. Options: Email/Password, GitHub OAuth. Successful authentication redirects to the dashboard. Unauthenticated access restricted to public puzzle viewing.
    *   **Details:** Utilize NextAuth.js. Implement session management. Protect routes using middleware or server components.

2.  **Puzzle Viewing:**
    *   **Flow:** Authenticated users see a list of available ARC puzzles on the dashboard. Clicking a puzzle navigates to the 'Puzzle Detail' page.
    *   **Details:** Display puzzle title, description, and a visual representation of the training and test grids. Allow filtering/sorting by difficulty.

3.  **Solution Submission & Execution:**
    *   **Flow:** On the 'Puzzle Detail' page, the user accesses the code editor. Writes their solution logic (e.g., Python function). Clicks 'Run' to test locally against training data or 'Submit' to run against test data and save the solution.
    *   **Details:** The backend will receive the code and puzzle ID. It will execute the code in a secure sandbox environment (e.g., using Docker or a managed service) against the puzzle's test cases. Results (correct/incorrect, execution time, output grid) are saved and displayed to the user.

4.  **Community Forum:**
    *   **Flow:** Navigate to the 'Forum' section. Users can create new threads, reply to existing ones, and view discussions related to specific puzzles or general AI reasoning.
    *   **Details:** Implement basic forum functionality: create post, reply, view posts. Integrate with user authentication to show author information.

5.  **Leaderboard:**
    *   **Flow:** Access the 'Leaderboard' page. Displays a ranked list of users based on solved puzzles, speed, and accuracy.
    *   **Details:** Query the `solutions` table, aggregate scores, and rank users. Cache results for performance.

**API & DATA FETCHING:**
- **API Routes (App Router - Server Actions/Route Handlers):**
  - `POST /api/auth/*`: Handled by NextAuth.js.
  - `GET /api/puzzles`: Fetch list of puzzles. `GET /api/puzzles/[id]`: Fetch single puzzle details.
  - `POST /api/solutions`: Submit a new solution. Request body: `{ puzzleId: string, code: string, language: string }`. Response: `{ solutionId: string, status: 'pending' | 'correct' | 'incorrect', message?: string }`.
  - `GET /api/solutions/[id]`: Fetch details of a specific submitted solution.
  - `GET /api/leaderboard`: Fetch leaderboard data.
  - `POST /api/forum/posts`: Create a new forum post.
  - `GET /api/forum/posts`: Fetch forum posts.
- **Data Fetching:** Use server components for initial data loading where possible. Utilize server actions for form submissions and mutations. Fetch client-side data with `fetch` API in `useEffect` or using libraries like SWR if needed for real-time updates.

**COMPONENT BREAKDOWN (Next.js App Router):**
- **`app/layout.tsx`:** Root layout (html, body, global providers, Tailwind setup).
- **`app/page.tsx`:** Landing Page (marketing, features overview, call to action).
- **`app/dashboard/page.tsx`:** User Dashboard (list of puzzles, recent activity, quick links).
- **`app/puzzles/[puzzleId]/page.tsx`:** Puzzle Detail Page (displays puzzle grids, code editor, submission form).
- **`app/puzzles/[puzzleId]/components/GridVisualizer.tsx`:** Component to render input/output grids.
- **`app/puzzles/[puzzleId]/components/CodeEditor.tsx`:** Monaco Editor or similar integrated code editor.
- **`app/solutions/[solutionId]/page.tsx`:** Solution Detail Page (shows user's code, execution results, output grid).
- **`app/leaderboard/page.tsx`:** Leaderboard Page (displays ranked users).
- **`app/forum/page.tsx`:** Forum Main Page (list of threads).
- **`app/forum/new/page.tsx`:** Create New Forum Post Page.
- **`app/forum/thread/[threadId]/page.tsx`:** View Single Forum Thread Page.
- **`app/auth/page.tsx`:** Sign In / Sign Up Page.
- **`app/profile/page.tsx`:** User Profile Page.
- **`app/(components)/Navbar.tsx`:** Top navigation bar.
- **`app/(components)/Footer.tsx`:** Footer section.
- **`app/(components)/ui/Button.tsx`:** Reusable button component (from shadcn/ui).
- **`app/(components)/ui/Input.tsx`:** Reusable input component.
- **`app/(components)/ui/Card.tsx`:** Reusable card component.
- **`app/(components)/ui/Dialog.tsx`:** Reusable modal/dialog component.

*State Management:* Use `useState` for local component state. Utilize React Context or Zustand for global state like user authentication status and theme preferences.

**UI/UX DESIGN & VISUAL IDENTITY:**
- **Style:** Modern Minimalist Clean with subtle futuristic accents.
- **Color Palette:**
    - Primary: `#4A90E2` (Vibrant Blue)
    - Secondary: `#50E3C2` (Teal/Mint)
    - Accent: `#F5A623` (Orange/Gold for highlights)
    - Background: `#1A1E2E` (Dark Navy/Deep Blue)
    - Surface: `#242A3E` (Slightly lighter dark for cards/modals)
    - Text (Primary): `#E0E0E0` (Light Gray)
    - Text (Secondary): `#AAB0C0` (Muted Gray)
- **Typography:** Inter font family. Headings: Inter Bold (e.g., 36px, 24px, 20px). Body: Inter Regular (e.g., 16px).
- **Layout:** Use a responsive grid system (Tailwind CSS). Generous whitespace. Clear visual hierarchy. Focus on readability.
- **Key Sections:** Header with logo and navigation. Main content area displaying puzzles/code editor/forum. Sidebar for quick links or puzzle details.
- **Responsiveness:** Mobile-first approach. Ensure usability on screens from 375px to 1920px+. Use Tailwind's responsive prefixes (`sm:`, `md:`, `lg:`, `xl:`).

**ANIMATIONS:**
- **Page Transitions:** Subtle fade-in/slide-in animations using Framer Motion or CSS transitions on route changes.
- **Hover Effects:** Gentle scaling or background color changes on interactive elements (buttons, links, cards).
- **Loading States:** Use shimmering placeholders (skeleton loaders) or spinners from shadcn/ui for data fetching.
- **Button Interactions:** Subtle click feedback (slight scale down).

**EDGE CASES:**
- **Authentication:** Handle expired sessions, unauthorized access attempts gracefully. Redirect to login page with clear messages.
- **Empty States:** Design informative and visually appealing empty states for dashboards, puzzle lists, forums, leaderboards when no data is available.
- **Error Handling:** Implement global error handling (e.g., using Error Boundaries in React) and specific error messages for API failures, validation errors, or execution errors. Use `try...catch` blocks extensively.
- **Validation:** Client-side and server-side validation for all user inputs (login forms, signup, code submission, forum posts) using Zod and React Hook Form.
- **Code Execution Sandbox:** Ensure the sandbox environment is secure, isolated, and has appropriate resource limits (timeout, memory) to prevent abuse.
- **Data Integrity:** Use database transactions for critical operations (e.g., saving solutions).

**SAMPLE DATA (JSON format for `gridData`):**

*Example ARC Puzzle Grid Structure:* Each puzzle object contains `training` and `test` arrays, each holding input/output grid pairs.

```json
{
  "id": "puzzle-1",
  "title": "Color Transformation",
  "description": "Apply a consistent color transformation based on the training examples.",
  "difficulty": 3,
  "gridData": {
    "training": [
      {
        "input": [[1, 1, 1], [1, 0, 1], [1, 1, 1]],
        "output": [[1, 1, 1], [1, 2, 1], [1, 1, 1]]
      },
      {
        "input": [[0, 0], [0, 0]],
        "output": [[2, 2], [2, 2]]
      }
    ],
    "test": [
      {
        "input": [[1, 0, 1], [0, 1, 0], [1, 0, 1]],
        "output": null // Expected output will be generated by the user's solution
      },
      {
        "input": [[2, 1], [1, 2]],
        "output": null
      }
    ]
  }
}
```

*Another Puzzle Example*

```json
{
  "id": "puzzle-2",
  "title": "Shape Replication",
  "description": "Replicate the patterns shown in the training outputs.",
  "difficulty": 2,
  "gridData": {
    "training": [
      {
        "input": [[0,0,1,0,0],[0,1,1,1,0],[1,1,1,1,1],[0,1,1,1,0],[0,0,1,0,0]],
        "output": [[1,1,1,1,1],[1,0,0,0,1],[1,0,0,0,1],[1,0,0,0,1],[1,1,1,1,1]]
      }
    ],
    "test": [
      {
        "input": [[0,1,0],[1,1,1],[0,1,0]],
        "output": null
      }
    ]
  }
}
```

*Mock User Data*

```json
[
  { "id": "user-1", "name": "Alice", "email": "alice@example.com", "image": "/images/avatars/alice.png" },
  { "id": "user-2", "name": "Bob", "email": "bob@example.com", "image": "/images/avatars/bob.png" },
  { "id": "user-3", "name": "Charlie", "email": "charlie@example.com", "image": null }
]
```

*Mock Solution Data*

```json
[
  { "id": "sol-1", "userId": "user-1", "puzzleId": "puzzle-1", "code": "def solve(grid): ...", "isCorrect": "correct", "submittedAt": "2023-10-26T10:00:00Z", "executionTimeMs": 150, "generatedOutput": [[1,1,1],[1,2,1],[1,1,1]] },
  { "id": "sol-2", "userId": "user-2", "puzzleId": "puzzle-1", "code": "def solve(grid): ...", "isCorrect": "incorrect", "submittedAt": "2023-10-26T10:05:00Z", "executionTimeMs": 200, "generatedOutput": [[1,0,1],[0,1,0],[1,0,1]] }
]
```

**TURKISH TRANSLATIONS:**
- **App Title:** Mantık Bulmaca Pro
- **Sign In:** Giriş Yap
- **Sign Up:** Kayıt Ol
- **Dashboard:** Pano
- **Puzzles:** Bulmacalar
- **Leaderboard:** Liderlik Tablosu
- **Forum:** Forum
- **My Profile:** Profilim
- **Submit Solution:** Çözümü Gönder
- **Run Code:** Kodu Çalıştır
- **Puzzle Title:** Bulmaca Başlığı
- **Description:** Açıklama
- **Create New Post:** Yeni Gönderi Oluştur
- **Search...:** Ara...
- **Settings:** Ayarlar
- **Logout:** Çıkış Yap
- **Correct:** Doğru
- **Incorrect:** Yanlış
- **Pending:** Bekliyor
- **Execution Time:** Çalıştırma Süresi
- **View Solution:** Çözümü Görüntüle
- **No puzzles found. Try creating one!** Henüz bulmaca bulunamadı. Bir tane oluşturmayı deneyin!
- **You haven't submitted any solutions yet.** Henüz çözüm göndermediniz.

This comprehensive prompt should provide enough detail for an AI to generate a fully functional MVP of Logic Puzzle Pro.