Aesthetic Cal

Aesthetic Cal is a cross-platform calendar application built with Flutter. The app focuses on customizable visual themes, monthly and weekly calendar views, and future Google Calendar synchronization.

The project was developed as a personal software project to explore Flutter app development, calendar interfaces, state management, and user-centered visual customization.

Features

• Monthly calendar view.
• Weekly calendar view.
• Mock event data for early-stage development.
• Customizable visual themes.
• Preset color palettes and typography styles.
• Theme editor for changing the calendar appearance.
• Provider-based state management.
• Planned Google Calendar synchronization.
• Designed for web and mobile deployment.

Technologies Used

• Flutter
• Dart
• Provider
• Google Fonts
• Google Calendar API v3
• Google APIs package
• Cross-platform UI development

Project Structure

lib/
├── main.dart                  # Application entry point
├── models/
│   └── cal_event.dart         # Event model and mock data
├── theme/
│   ├── month_theme.dart       # Theme model and preset palettes
│   └── theme_provider.dart    # Theme state management
├── screens/
│   └── calendar_screen.dart   # Main calendar screen
└── widgets/
    ├── month_view.dart        # Monthly calendar view
    ├── week_view.dart         # Weekly calendar view
    └── theme_editor.dart      # Theme customization bottom sheet

Included Theme Palettes

Palette	Description
Amethyst	Linen, Dolphin, Amethyst, with Playfair Display
Matcha Strawberry	Sage green and pink, with Lato
Vanilla	Cream and coffee tones, with Cormorant Garamond

Setup

1. Create a Flutter project

flutter create aesthetic_cal
cd aesthetic_cal

2. Replace the lib/ folder

Replace the default lib/ folder with the one provided in this repository.

3. Install dependencies

flutter pub get

4. Run on web

flutter run -d chrome

5. Run on mobile

flutter run

Google Calendar Sync Plan

Google Calendar integration is planned through the Google Calendar API v3.

Planned setup:

1. Create a project in Google Cloud Console.
2. Enable Google Calendar API.
3. Create OAuth 2.0 credentials for Web, Android, and/or iOS.
4. Add the client_id to the app.
5. Implement a CalendarService using the googleapis package.

Required scopes:

const scopes = [
  'https://www.googleapis.com/auth/calendar.readonly',
  'https://www.googleapis.com/auth/calendar.events',
];

Roadmap

• Week 1: Monthly view, weekly view, theme engine, and mock data.
• Week 2: Google Calendar OAuth, read events, and create events.
• Week 3: Hex color picker, full font picker, and monthly palettes.
• Week 4: Image export, animations, and final UI polish.

Learning Outcomes

Through this project, I practiced:

• Building cross-platform applications with Flutter.
• Structuring a Flutter project into models, screens, widgets, and theme logic.
• Managing application state with Provider.
• Designing customizable UI components.
• Creating reusable calendar widgets.
• Planning integration with external APIs.
• Building user-centered productivity tools.

Possible Improvements

• Add screenshots or GIFs of the monthly and weekly views.
• Add a demo section with example themes.
• Complete Google Calendar OAuth integration.
• Add recurring event support.
• Add local data persistence.
• Add unit/widget tests.
• Add responsive layout improvements for desktop and tablet.
• Publish a release build for web or Android.

Notes

This project is currently under development. Some features are implemented with mock data, while Google Calendar synchronization is planned as a future integration.