English | 繁體中文 | 简体中文 | 日本語 | 한국어

BA Gift Planner - Blue Archive Gift Planner

This is a gift planner designed for players of the mobile game "Blue Archive". Built with Vue 3 and Vite, this project provides a clean, fast, and responsive interface to help players quickly find the optimal gifting strategy for the students whose bond levels they want to increase. All information and materials used on this website are the property and copyright of their respective authors.

➡️ Click here to visit the website

Note

You might notice that this website has two names: BA Gift Planner and Sensei Harem Tool. BA Gift Planner was the tentative name in the early stages of the project, and I am still considering which name to unify it under.

---

✨ Key Features

Note

The website currently supports English, Japanese, Traditional Chinese, Simplified Chinese, and Korean. If you would like to help me add support for other languages, please submit a PR.

Gift Recommendation Page

1️⃣ Open the character selector and choose your waifus😋... I mean, students.

2️⃣ Close the character selector to see the results (yes, it's that simple!). Here, I'm only showing a part of the results.

Students who are not the best choice will have a semi-transparent + dashed border effect. If you don't want to see non-optimal choices, you can change the settings in the settings interface:

3️⃣ Check which gifts can be given freely (SSR) or used to craft a Gift Selection Box (SR).

4️⃣ Alright, now you can open the game and start building relationships with your students. No more worrying about giving the wrong gift or not knowing which gifts can be used for crafting! 🎉

Bond Calculator Page

1️⃣ Set Gift Inventory

2️⃣ Set Student's Bond Level and EXP

3️⃣ Start creating a gift plan

4️⃣ Instantly Preview the Plan's Effect

5️⃣ Set a Target Level and Check the Gap

6️⃣ Apply the Plan

These features make bond calculation simple. It's convenient whether you want to sync your in-game progress for meticulous affection planning, simply set approximate values to see how far you are from your goal, or find out what you can achieve with your current gift inventory.

🛠️ Main Development Frameworks & Packages

• Frontend Framework: Vue 3 (Composition API)
• Build Tool: Vite
• State Management: Pinia
• Routing: Vue Router
• Code Style: Prettier
• Linter: ESLint
• Deployment Platform: CloudFlare

🚀 Local Development

Please ensure you have Node.js (version 18.x or higher is recommended) installed on your computer.

1. Clone the project

   git clone https://github.com/Yuuzi261/BA-Gift-Planner.git

2. Navigate to the project folder

   cd BA-Gift-Planner

3. Install dependencies

   npm install

4. Start the development server

   npm run dev

   After starting, the browser will automatically open to http://localhost:5173.

5. Build the project To build the files for a production environment, run:

   npm run build

   The built files will be stored in the dist folder.

Project Scripts

Command	Description
npm install	Installs all project dependencies.
npm run dev	Starts the local development server with hot-reloading.
npm run build	Bundles the project into the dist folder and compresses JSON files.
npm run preview	Previews the production build locally.
npm run format	Formats all code with Prettier.
npm run lint	Lints and fixes code style issues with ESLint.

📁 Project Structure

BA-Gift-Planner/
├── public/            # Public assets, not processed by Vite
├── src/
│   ├── assets/        # Static assets like images, fonts, and data JSONs
│   ├── components/    # Reusable Vue components
│   ├── composables/   # Composable functions (Hooks)
│   ├── data/          # Application data
│   ├── directives/    # Custom directives
│   ├── locales/       # i18n language files
│   ├── router/        # Vue Router configuration
│   ├── store/         # Pinia state management
│   ├── utils/         # Shared utility functions
│   ├── views/         # Page components
│   ├── App.vue        # Main component
│   ├── main.js        # Application entry point
│   └── style.css      # Global styles
├── .env               # Global variables
├── .prettierrc.json   # Prettier configuration file
├── eslint.config.js   # ESLint configuration file
├── index.html         # HTML entry file
├── package.json       # Project dependencies and scripts
└── vite.config.js     # Vite configuration file

🤝 Contribution and Assistance

This project warmly welcomes community contributions, whether it's updating data, reporting bugs, adding language support, or providing suggestions.

You can help us in the following ways:

• Raise issues and suggestions in Issues.
• Submit missing character data or code changes via Pull Requests.

📄 License

This project is licensed under the MIT License.