ツールをGUI(画面)で作る場合、画面やイベントを考え始めると手が止まることがあります。
私は、画面を設計して作るのは面倒、難しそうだという先入観があり、なかなか手を出せずにいました。
この記事では、ChatGPTとCodexを使い、既存のCLI版パスワード生成ツールをPySide6でGUI化し、ノーコーディングで実際に動くツールを作った経験を紹介します。
この記事の内容は2025年12月に確認しています。

この記事で分かること

  • CLIツールをGUI化した具体的な流れ
  • ChatGPTとCodexの役割分担
  • PySide6を使ったノーコーディング開発の進め方
  • 実際にハマったポイントと対処内容

今回の元ネタとなるCLIパスワード生成ツール

今回のGUIツールは、以前作成したコマンドラインで動作するパスワード生成ツールを元にしています。
このCLIツールは、次の記事で詳しく紹介しています。

このツールは、コマンドライン引数で文字種や長さを指定し、安全なランダムパスワードを生成するシンプルな構成です。
今回は、このロジックをそのまま使い、操作方法だけをGUIに置き換えることを目的としました。

今回GUI版を作ろうと思った理由

CLIツールは慣れている人にとっては便利ですが、毎回コマンドを打つのが面倒だと感じる場面もあります。
特に、ちょっとしたパスワード生成であれば、画面上で条件を選んで生成できたほうが楽です。
そこで、既存のロジックを活かしつつ、GUIツールとして使える形にしたいと考えました。

また、ChatGPTとCodexを使えば、GUI開発もノーコーディングでどこまでできるのかを実際に試してみたいという意図もありました。

PySide6とは何か

PySide6は、Qt公式が提供しているPython用のGUIフレームワークです。
QtはC++で広く使われているGUIライブラリですが、PySide6を使うことでPythonからQtを扱えます。
Qt Designerを使えば、画面をコードではなくUIファイルで設計できる点も特徴です。
公式サイト(英語)は以下です。
https://doc.qt.io/qtforpython/

今回は、このPySide6とQt Designerを使い、画面設計とロジックを分離する構成を採用しました。

ノーコーディングでGUIツールを作る方針

今回の最大のポイントは、自分でコードを書かないことです。
実装はすべてCodexに任せ、人間は仕様と判断だけを行います。

ChatGPTに次のような指示を出して、仕様書としてAGENTS.md、作業計画としてPLANS.mdを作ってもらいました。
この2つで、何を作るのか、どの順番で作るのかを明確にします。

STEP1
仕様書案の出力

次のようにたたき台を出すように指示します。

下記はパスワード生成ツールです。
コマンドラインで動くものですが、pyside6を使ったものを作ります
codexで作成してもらうので、仕様を出して
https://github.com/ojichiku/public-python-samples/blob/main/samples/password-generator-cli/password_gen.py

パスワード生成のロジックは、新しく考えるのではなく、既存のCLI実装をそのまま使うように指示しました。
ロジックの元ネタはこちらです。
password_gen.py(GitHub)

STEP2
UIファイルの変更

②UIの変更
ChatGPTが提示した案についてPySide6では画面を.uiファイルで作成し、そのUIを読み込むPythonコードとロジックを分けるように修正を指示しました。

5. モジュール構成(推奨)でuiはxmlを使うように修正して
STEP3
AGENTS.mdの出力

ChatGPTの提示案について修正が完了したのでAGENTS.mdの出力を依頼します。

今までのやり取りを入れて、Codexにpyside6を使ったパスワード生成ツールを作ってもらいます。
パスワード生成の実装は下記を使います。
https://github.com/ojichiku/public-python-samples/blob/main/samples/password-generator-cli/password_gen.py

仕様を書いたAGENTS.mdを作ってください。

実際に作成されたAGENTS.mdは次の通りです。
AGENTS.md(GitHub)

STEP4
PLANS.mdの作成

ChatGPTに次の指示を投げてPLANS.mdを作ってもらいます。
細かい指示を依頼していないです。

PLANS.mdも作ってください

実際に作成されたPLANS.mdは次の通りで、ステップごとに成果物を作るように定義されています。
PLANS.md(GitHub)

今回の開発で作成されるファイル構成は次の通りです。
画面デザイン・項目を設定したuiファイルを分けた構成にしています。

samples/
└─ password-generator-gui/
   ├─ resources/
   │  └─ ui/
   │     └─ main_window.ui      # 画面デザイン・項目を設定したuiファイル
   ├─ src/
   │  └─ password_gui/
   │     ├─ __init__.py
   │     ├─ __main__.py         # メイン、GUIを起動する
   │     ├─ main_window.py      # uiファイルを読み込んで画面を表示する
   │     └─ generator.py        # CLI実装を移植したパスワード生成のロジック
   └─ tests/
      └─ test_generator.py

いつもの開発手順とプロジェクト作成

開発は、今までのCodexを使用した場合と同じ流れで進めます。
Codexを使用するため、VSCodeでWSL上を起動した後、次のリポジトリをクローンします。
https://github.com/ojichiku/public-python-samples

クローン後、GUI用のブランチを作成します。

git switch -c feature/password-generator-gui

次に、samples配下に新しいプロジェクトを作成します。
uvを使ってPythonプロジェクトを初期化し、不要なファイル「main.py」を削除します。

cd samples/
uv init password-generator-gui --python 3.13

pytestとPySide6を追加するため、下記のコマンドを実行します。
ここで問題が発生し、設定を手で修正する必要がありました。
問題点・対応は「作ってみてハマったポイント」のところで詳しく書いています。

cd password-generator-gui
uv add --group test pytest
uv add pyside6

Codexへの指示の出し方

Codexには、PLANS.mdに書いたステップに従って、次の表のように指示を分割して出しました。
いきなり全体を作らせるのではなく、ステップごとに確認しながら進める形です。
このやり方にすると、意図と違う実装になりにくく、修正指示も最小限で済みました。

ステップ指示内容作成されるもの
STEP 1:UI作成(Qt Designer)STEP 0(事前準備)は実行済みです。
STEP 1:UI作成(Qt Designer)を作成できる?
main_window.ui
STEP 2:ロジック層実装STEP 2 のロジック移植をお願いgenerator.py
STEP 3:ロジック単体テスト(pytest)STEP 3:ロジック単体テスト(pytest) を実行してください。
テストクラスのコメントを日本語で付けてください
tests/test_generator.py
STEP 4:GUI層実装STEP 4:GUI層実装(main_window.py)の実装をお願いmain_window.py
STEP 5:エントリポイント確認STEP 5:エントリポイント確認(main.py)の実装をお願いmain.py

作ってみてハマったポイント

実際に作業を進めると、いくつか想定外の問題にハマりました。

①uvとworkspace構成の問題
リポジトリが次のようにモノレポ構成になっているため、プロジェクト作成時、public-python-samplesのpyproject.tomlにworkspace設定が自動で追加されます。

public-python-samples/
└── samples
  ├── csvfilter-cli          # CSVフィルターツール
  ├── file-renamer-cli       # ファイルリネームツール
  ├── logfilter-cli          # CSVフィルターツール
  └── password-generator-cli # パスワード生成ツール

次の設定を削除しないと、サブプロジェクトに.venvが作成されず、uv addで追加するPythonライブラリがプロジェクト直下の.venvに入ります。
この設定を削除することで、サブプロジェクトごとに.venvが作成されて、プロジェクトごとでインストールするPythonライブラリを分けることが可能になります。

[tool.uv.workspace]
members = [
    "samples/password-generator-gui",
]

②pre-commitとpytestの問題
pre-commitの設定ファイル「.pre-commit-config.yaml」が次のように設定されている場合、リポジトリ全体が対象になり、プロジェクト直下の.venvに参照されます。
サブプロジェクトでインストールしたPythonライブラリが存在しないため、pytestが失敗してコミットができない状態になります。

  # --- Local pytest hook ---
  - repo: local
    hooks:
      - id: pytest
        name: Run pytest
        entry: uv run pytest
        language: system
        types: [python]
        pass_filenames: false

これについては、サブプロジェクトごとにpytestを実行する設定を修正することで対応しました。
修正した内容は下記の通りです。

  - repo: local
    hooks:
      - id: pytest-common
        name: Run pytest (python-common-sample)
        entry: bash -lc 'cd samples/python-common-sample && uv run pytest'
        language: system
        pass_filenames: false
        files: ^samples/python-common-sample/

      - id: pytest-passgen-gui
        name: Run pytest (password-generator-gui)
        entry: bash -lc 'cd samples/password-generator-gui && uv run pytest'
        language: system
        pass_filenames: false
        files: ^samples/password-generator-gui/

③WSLで日本語が表示されない
WSLでGUIを起動した画面の操作を行っていた際、日本語のメッセージが表示されない問題が発生しました。
これは日本語フォントが入っていなかったことが原因で、次のようにフォントをインストールすることで解消しました。

sudo apt-get install fonts-noto-cjk

GUIツールの画面

最終的に、パスワード生成のGUIツールは問題なく動作しました。
画面上で条件を選び、ボタンを押すだけでパスワードが生成されます。
実際にCodexを使ってノーコーディングで作成したGUIツールの画面は次の通りです。

自分でコードを書かずに、ここまで実用的なGUIツールが作れたことは、正直想像以上でした。

まとめ

今回は、既存のCLIツールを元に、ChatGPTとCodexを使ってGUIツールをノーコーディングで作成しました。
作ってみないと分からない部分は確かにありますが、実際にやってみると現実的な手法だと感じました。
ChatGPTで仕様と計画を作り、Codexに実装を任せるやり方は、今後も使える選択肢だと思います。