Character Creator Site Plan

Overview

Purpose

This website allows users to create and generate unique characters for storytelling and entertainment. Users can also browse and search a collection of saved characters, making it a useful tool for inspiration and organization.

Audience

The intended audience includes writers, gamers, and students who want to create or explore interesting characters. It is especially useful for users looking for quick inspiration or a way to store and manage their own character ideas.

Dynamic Elements

JavaScript will be used to create and manage dynamic content throughout the site. Users will be able to input character information and store it using localStorage, allowing data to persist even after the page is refreshed. The site will dynamically display saved characters and allow users to search or filter them. Additionally, JavaScript will update the page in real time when characters are added or selected. The site will also use event listeners to respond to user actions such as button clicks and search input.

Branding

Website Logo

Style Guide

Color Palette

Palette URL: coolors palette

• Primary: #555555
• Secondary: #219ebc
• Accent 1: #5a189a
• Accent 2: #dbb42c

Typography

Heading Font: Orbitron

Paragraph Font: Arial, sans-serif

Normal paragraph example

This website provides an interactive way to create and manage unique characters. Users can quickly input details or generate ideas, making it a useful tool for storytelling, gaming, or creative projects.

Colored paragraph example

The character library allows users to search and explore saved characters easily. With dynamic updates and filtering options, users can quickly find and review character details in an organized way.

Content

Home Page (Character Creator)

• Title: “Character Creator”
• Short description: “Create and save unique characters”
• Inputs:
  • Name
  • Role
  • Trait
  • Weakness
  • About / Backstory
• Buttons:
  • Add Character
  • Generate Character (optional)
• Confirmation message when character is saved

Character Library Page

• Title: “Character Library”
• Features:
  • Search bar (by name)
  • Optional filter (by role)
  • Display as cards or list
• Interaction:
  • Click character to view details:
    • Name
    • Role
    • Trait
    • Weakness
    • About / Backstory

Wireframes

Home Page

[Navigation]

[Title: Character Creator]

[Name Input]
[Role Input]
[Trait Input]
[Weakness Input]
[About/Backstory Input]

[Add Character Button]
[Generate Button]

[Confirmation Message]
        

Character Library Page

[Navigation]

[Title: Character Library]

[Search Bar]

[Character List]
- Zara Vex
- Eli Rowan

[Selected Character Details]
(Name, Role, Trait, Weakness, About)