Read-only PRD for a coding agent
An artist needs a public website to showcase artworks without relying on social media.
What Iulia learned
Saved time by taking into consideration UI choices and design
1. Problem, goal & success metric
- Problem: an artist needs a public website to showcase artworks without relying on social media.
- Goal: present a clean gallery of artworks split into Projects and Sketches, with clickable previews showing title and artwork, leading to a detail page with title, description (medium, date, message), and a larger image.
- Success metric: at least 20 unique visitors per month and at least one artwork upload or edit by the artist per month.
2. Users & roles
- Artist (you): the only person who can add, edit, or remove artworks and projects. Logs in with Base44 built-in email + password.
- Visitor: can only view artworks; no editing or upload rights.
3. Core workflows
- Visitor lands on home page and browses artwork previews grouped by Projects and Sketches.
- Visitor clicks a preview to open an artwork detail page showing a larger image, title, and description (medium, date, message).
- Artist logs into Base44 admin with email + password, uploads an image file, enters title and short description, and assigns each artwork to Projects or Sketches.
- Artist can edit or delete any artwork at any time.
4. Features & requirements
- Public gallery: lists artwork previews (thumbnail image + title) grouped into exactly two categories: Projects and Sketches. Each artwork belongs to exactly one category.
- Artwork detail page: clickable from a preview; shows larger image, title, and description (medium, date, message); link back to gallery.
- Artist admin: email + password login page plus a form to create, edit, and delete artworks, including image file upload (PNG or JPEG, max 5 MB each), title field, description field, and category dropdown (Projects vs Sketches).
- Category assignment: each artwork is assigned to exactly one category at creation and can be changed on edit; an artwork cannot appear in both categories simultaneously.
5. Scope: must / later / never
Scope:
- Must: public gallery with Projects/Sketches categories (one category per artwork), clickable artwork previews, detail pages, artist admin with image upload (PNG/JPEG, max 5 MB), title and description fields, email + password login (no password reset).
- Later: contact form, artwork prices, “for sale” tags, visitor comments, social sharing, search, password reset, multiple admin users.
- Never: e-commerce checkout, visitor user accounts, video playback, storing images outside the Base44 project folder.
6. Screens & UI
- Home / gallery page: artwork previews (thumbnail + title) grouped by Projects and Sketches; previews are clickable. Visual reference: https://www.valeriehammond.com/home
- Artwork detail page: larger image, title, description (medium, date, message); link back to gallery.
- Artist login page: email and password; no password reset link.
- Artist admin page: add/edit/delete artworks with image file upload, title field, description field, category dropdown.
7. Design system & visual style
- Component library: Base44 built-in UI components styled with custom CSS where supported.
- Colors: background #FAF9F6 (off-white), text #1A1A1A (near-black), links #1A1A1A underline on hover, buttons #1A1A1A background with #FFFFFF text.
- Font: Courier New, monospace; headings 32 px, body 16 px.
- Corners: 4 px radius.
- Spacing: 24 px base grid.
- Light/dark mode: light only.
- Tone: minimal, quiet, gallery-like.
- Visual reference: https://www.valeriehammond.com/home (see screenshots if attached)
8. Data model
| Field | Type | Required | Notes |
|---|---|---|---|
| id | string | yes | Base44-generated unique ID |
| title | string | yes | Max 200 chars |
| description | text | yes | Medium, date, message |
| category | enum | yes | Exactly one of: Projects, Sketches |
| media_type | enum | yes | Either "image" or "video" |
| media_url | string | yes | Base44-hosted file URL |
| alt_text | string | yes | Short description for accessibility |
| created_at | datetime | yes | Auto-generated |
| updated_at | datetime | yes | Auto-generated |
Rules: each artwork belongs to exactly one category; images max 5 MB (PNG/JPEG only); videos max 25 MB (MP4/WebM only); an artwork cannot be both image and video.
9. APIs & integrations
Base44 platform
- Image and video storage: media files uploaded and stored inside the Base44 project folder.
- Auth: Base44 built-in email + password for one admin user. No external auth provider.
- Data store: Base44 managed database for artwork records.
- Hosting: Base44 free tier on a Base44 subdomain.
- External integrations: none. No contact form, no e-commerce, no social sharing.
10. Auth, permissions & security
- Auth: email + password login for one artist only. No password reset flow. No visitor accounts. Protected admin routes require a valid session; unauthenticated access redirects to the login page.
- Permissions: artist can create, read, update, delete all artworks and categories; visitor can only read public gallery and detail pages.
11. Performance, privacy & accessibility
Performance
- Home page loads in under 3 seconds on a 4G mobile connection.
- Gallery thumbnails are optimized so the page does not download full-size images or videos for previews.
Privacy
- No visitor tracking, cookies, or analytics.
- No visitor accounts or personal data collected.
- Artist email stored only for Base44 login.
Accessibility
- Every artwork image and video has alt text.
- Gallery and detail pages are keyboard navigable.
- Color contrast meets WCAG AA for text on background.
- Mobile-friendly layout without horizontal scrolling.
12. Edge cases & errors
Upload validation
- Image larger than 5 MB: block upload, show error "File is too large. Maximum 5 MB."
- Video larger than 25 MB: block upload, show error "File is too large. Maximum 25 MB."
- File not PNG, JPEG, MP4, or WebM: block upload, show error "Wrong file type. Only PNG, JPEG, MP4, or WebM are allowed."
- Missing title: block upload, show error "Title is required."
- Upload fails entirely (network or server error): show generic error "Upload failed. Try again later." with no retry button.
Session & auth
- Session expires while editing: redirect to login; after sign-in, return to the same admin page.
- Unauthenticated access to admin routes: redirect to login page.
- Deleting an artwork: remove file and record; no undo.
- Editing category: an artwork cannot appear in both Projects and Sketches at once.
Edge display states
- No artworks in a category: show empty state "No artworks yet" under that heading.
- Missing media URL: show placeholder or broken-media fallback with alt text.
13. Stack & constraints
Platform
Base44 no-code platform (free tier), Base44 subdomain.
Constraints
- One app and one data store inside Base44.
- Images and videos stored inside the Base44 project folder.
- No microservices, queues, caches, separate API servers, or external auth.
- Built-in Base44 email + password auth for one admin user.
- Light-only theme, Courier New font.
14. Existing code & do-not-change
Not needed: this is a new project with no existing code.
15. Build order
- Scaffold Base44 app: set light theme, Courier New font, Base44 subdomain; end result is an empty app you can open.
- Build public gallery page: artwork previews (thumbnail image + title) grouped under Projects and Sketches headings; each preview clickable; end result is a browsable gallery.
- Build artwork detail page: larger media (image or playable video), title, description (medium, date, message), alt text, link back to gallery; end result is a detail page you can open from any preview.
- Build artist admin login page: email + password, no password reset link; end result is a login page that authenticates one admin user.
- Build artist admin create/edit/delete form: image/video upload (PNG/JPEG max 5 MB; MP4/WebM max 25 MB), title field, description field, category dropdown, validation error messages; end result is a form that can add an artwork.
- Protect admin routes: redirect unauthenticated users to login; return to same admin page after sign-in; test mobile layout, accessibility, upload error handling; deploy to Base44 free subdomain; end result is a live, protected gallery app.
16. Acceptance criteria & tests
Public gallery
- [ ] Home page lists artwork previews grouped under exactly two headings: Projects and Sketches.
- [ ] Each preview shows a thumbnail image or video preview and title.
- [ ] Each artwork appears under only one category, never both.
- [ ] Clicking a preview opens the artwork detail page.
Artwork detail page
- [ ] Shows larger media (image or playable video), title, and description (medium, date, message).
- [ ] Every media item has alt text.
- [ ] Link back to the gallery.
Artist admin
- [ ] Email + password login page with no password reset link.
- [ ] Form to create artwork: media upload (PNG/JPEG max 5 MB; MP4/WebM max 25 MB), title field, description field, category dropdown.
- [ ] Upload blocked with specific errors for file too big, wrong type, or missing title.
- [ ] Edit and delete any artwork.
- [ ] Session expiry redirects to login and returns to the same admin page after sign-in.
Mobile & accessibility
- [ ] Gallery and detail pages render without horizontal scrolling on a phone.
- [ ] All media items have alt text.
Performance
- [ ] Home page loads in under 3 seconds on 4G.
17. Deployment, environments & secrets
Deploy the finished app to Base44 free tier on your Base44 subdomain. No separate environments, environment variables, or secrets to manage — Base44 handles auth, media storage, and the database internally.
18. Open questions & assumptions
- Default: build order is 6 slices as listed above.
- Default: deployment targets Base44 free tier on your Base44 subdomain.
- Default: no contact form, e-commerce, search, social sharing, visitor accounts, or multiple admins will ever be added.