---
title: "ソロアーティスト 画面設計書"
---

最終更新: 2026-09-30
関連 Issue: MorningStatusApp#1673（ソロ活動およびユニット活動の調査）/ morning-status-blume#167（初版作成）

## 1. 概要

ソロアーティスト機能で追加・変更される画面の設計。
新規2画面（ソロアーティスト一覧・ソロアーティスト詳細）と、既存5画面（Topページ・メンバー詳細・リリース詳細・曲詳細・プレイリスト詳細）への追加・変更を定義する。

データ設計については [ソロアーティスト データ設計書](/design/solo/solo-data-design) を参照。

---

## 2. 画面一覧（ソロアーティスト関連）

| 画面名 | URL パターン | レンダリング方式 |
| --- | --- | --- |
| ソロアーティスト一覧 | `/solos` | SSR（動的） |
| ソロアーティスト詳細 | `/solos/[id]` | SSR（動的） |

> 既存画面への追加・変更は §5 を参照。
> `[id]` は `SoloArtist.memberId`（`Member.id`）。ソロアーティストは1メンバーにつき1エントリのため、別途の識別子は持たない。

---

## 3. ソロアーティスト一覧画面（`/solos`）

### 概要

ソロアーティストをカード形式で一覧表示する画面。`solos.json` のデータをVercel Blobから取得して表示する。

### 表示コンテンツ

| 要素 | 内容 |
| --- | --- |
| ナビゲーション | 「ホームに戻る」リンク（Topページへ） |
| ページタイトル | 「ソロアーティスト」 |
| ソロアーティスト数 | 一覧表示するソロアーティストの件数（例: `19件`） |
| ソロアーティストカード一覧 | 後述のルールに従って表示 |

### 並び順

`activeFrom` 降順（新しい順）。`activeFrom` が同じ場合は `solos.json` の登録順のまま表示する。

### ソロアーティストカードの表示項目

| 項目 | 内容 | リンク先 |
| --- | --- | --- |
| 名義 | `SoloArtist.name`。省略時は `Member.name`（`memberId` から解決） | ソロアーティスト詳細画面 |
| 活動期間 | `activeFrom` ～ `activeTo`。`activeTo` 未設定の場合は「現在」と表示 | — |
| 作品数 | `releaseIds` のうち `Release` として解決できた件数（例: `25作品`）。`releaseIds` が未設定・空の場合は `0作品` | — |

`memberId` に一致するメンバーが `members.json` に存在しないエントリは一覧に表示しない。

### データなし表示

`solos.json` が存在しない、または空配列の場合は「ソロアーティストのデータがまだありません」などのメッセージを表示する。

---

## 4. ソロアーティスト詳細画面（`/solos/[id]`）

### 概要

特定のソロアーティストの詳細情報と関連リリース一覧を表示する画面。

### アクセス制御

| 条件 | 挙動 |
| --- | --- |
| `[id]` に一致するソロアーティストが存在しない | `notFound()` を返す |
| `[id]` に一致するメンバーが `members.json` に存在しない | `notFound()` を返す |

### 表示コンテンツ

| 要素 | 内容 | リンク先 |
| --- | --- | --- |
| ナビゲーション | 「ソロアーティスト一覧に戻る」リンク | ソロアーティスト一覧画面 |
| 名義 | `SoloArtist.name`。省略時は `Member.name` | — |
| メンバー | `Member.name`（漢字氏名）と世代バッジ（`{generation}期`）のバッジ。`name` の設定有無によらず常に表示する | メンバー詳細画面 |
| 活動期間 | `activeFrom` ～ `activeTo`。`activeTo` 未設定の場合は「現在」と表示 | — |
| 関連リリースセクション | `releaseIds` から引いたリリース一覧（後述） | — |

### 関連リリースセクション

**データソース**: `Release`（Neon）から `releaseIds` に一致するリリースを取得する。

**表示項目**:

| 項目 | 内容 | リンク先 |
| --- | --- | --- |
| フォーマットバッジ | `FORMAT_LABEL[format]` のラベル | — |
| リリースタイトル | `Release.title` | リリース詳細画面 |
| リリース日 | `Release.releaseDate`（YYYY-MM-DD 形式。不明の場合は「発売日不明」） | — |

**ソート順**: `releaseDate` 降順（新しい順）。

**ゼロ件時**: `releaseIds` が未設定・空配列、または全 ID が解決できない場合は「リリースデータがありません」を表示する。

---

## 5. 既存ページへの追加・変更

### 5.1 Topページへの追加

Topページのナビゲーションリンクに「ソロ」を追加し、リンクを次の順に並べる: メンバー・関係性マップ・平均年齢・リリース・ユニット・ソロ・プレイリスト・対比・ライブ・フェス・ラジオ。「ソロ」のクリックでソロアーティスト一覧画面に遷移する。

ナビゲーションリンクは折り返し表示（幅が足りない場合は次の行に送られる）のため、リンクを1つ追加してもモバイル幅で表示が崩れることはない。

### 5.2 メンバー詳細画面への追加 [#5.2]

**追加セクション名**: 「ソロ活動」

**配置場所**: 「所属ユニット」セクションの直後・「ご当地ライブ」セクションの前に配置する。

**データソース**: `solos.json` から `memberId` が当該メンバーの ID と一致するエントリを取得し、`releaseIds` からリリースを引く。


**表示項目**:

| 項目 | 内容 | リンク先 |
| --- | --- | --- |
| 名義 | `SoloArtist.name`。省略時は `Member.name`。セクション先頭に表示 | ソロアーティスト詳細画面 |
| 活動期間 | `activeFrom` ～ `activeTo`。`activeTo` 未設定の場合は「現在」と表示 | — |
| リリース一覧 | フォーマットバッジ・リリースタイトル・リリース日（リリース日の降順で全件表示する） | リリース詳細画面 |

**表示条件**: 当該メンバーのソロアーティストのエントリが存在する場合に表示する。`releaseIds` が未設定・空の場合は、名義・活動期間を表示する。

### 5.3 リリース詳細画面への追加 [#5.3]

**追加セクション名**: 「アーティスト」

**配置場所**: 「収録曲一覧」セクションの後に配置する。

**データソース**: `solos.json` から `releaseIds` に当該リリースの ID を含むエントリを抽出する。

**表示項目**:

| 項目 | 内容 | リンク先 |
| --- | --- | --- |
| 名義 | `SoloArtist.name`。省略時は `Member.name` | ソロアーティスト詳細画面 |
| 活動期間 | `activeFrom` ～ `activeTo`。`activeTo` 未設定の場合は「現在」と表示 | — |

**表示条件**: 該当するソロアーティストが存在するリリースで表示する。

---

### 5.4 曲詳細画面への追加 [#5.4]

曲詳細画面の「アーティスト」に、ソロアーティストの名義を表示する。

**表示条件**: `Track.artistMbid` が `SoloArtist.mbids` のいずれかに含まれる場合に、ソロアーティストの名義を表示する。

**表示項目**:

| 項目 | 内容 | リンク先 |
| --- | --- | --- |
| アーティスト名 | `SoloArtist.name`。省略時は `Member.name` | ソロアーティスト詳細画面 |

---

### 5.5 プレイリスト詳細画面への追加 [#5.5]

プレイリスト詳細画面の楽曲エントリのアーティスト名に、ソロアーティスト詳細画面へのリンクを表示する。

**データソース**: `PlaylistEntry.trackId` をキーに `releases` のトラックを直引きし、`Track.artistMbid` が `SoloArtist.mbids` のいずれかに含まれるかでソロアーティストを判定する。

**表示項目**:

| 項目 | 内容 | リンク先 |
| --- | --- | --- |
| アーティスト名 | `SoloArtist.name`。省略時は `Member.name` | ソロアーティスト詳細画面 |

**表示条件**: ソロアーティストを判定できた場合に表示する。

---

## 6. クロスリンク設計図

```mermaid
flowchart LR
  TOP["Topページ\n/"]
  SOLOS["ソロアーティスト一覧\n/solos"]
  SOLO["ソロアーティスト詳細\n/solos/:id"]
  MEMBER["メンバー詳細\n/members/:id"]
  RELEASE["リリース詳細\n/releases/:id"]
  TRACK["曲詳細\n/songs/:id"]
  PLAYLIST["プレイリスト詳細\n/playlists/:id"]

  TOP -- ソロリンク --> SOLOS
  SOLOS -- ホームに戻る --> TOP
  SOLOS -- カードクリック --> SOLO
  SOLO -- ソロアーティスト一覧に戻る --> SOLOS
  SOLO -- メンバーバッジクリック --> MEMBER
  SOLO -- リリースタイトルクリック --> RELEASE
  MEMBER -- ソロ活動 > 名義 --> SOLO
  MEMBER -- ソロ活動 > リリースタイトル --> RELEASE
  RELEASE -- 収録曲一覧 > 曲名 --> TRACK
  RELEASE -- アーティスト > 名義 --> SOLO
  TRACK -- アーティスト > 名義 --> SOLO
  PLAYLIST -- アーティスト名クリック --> SOLO
```

---

## 7. データ取得層の設計方針

Server Componentでの直接取得とする（[ソロアーティスト データ設計書](/design/solo/solo-data-design) §8）。

---

## 改訂履歴

| 版 | 更新日 | 変更内容 |
| --- | --- | --- |
| 1.0 | 2026-09-30 | 【対応する実装: 実装時に追記】初版作成（MorningStatusApp#1673, morning-status-blume#167） |