Affinityのアートボードはレイヤーです
これはAffinity by Canva Advent Calendar 2025の20日目に記事です。前日はベーコンさん、明日はなたのさんです。
なおこの内容は『Affinity解体新書』(仮称。そもそも出るのか、出せるのかすら未定)に含まれます。
今回はAffinityのデータ構造の中核の話です。ずばり、「Affinityのデータはレイヤーでできている」ということです。アートボードもレイヤー、ページもレイヤー、マスターページもレイヤー、およそドキュメント上に表示されるものはすべてレイヤーなのがAffinityです。全部話すと長くなるので、今回はアートボードに絞って話をします。
そもそもアートボードという概念がいつからあったのかは知りません(さすがにすべてのアプリケーションを調べることはできない)が、Illustratorで導入されたのは2008年10月のCS4(14.0)からです。そしてPhotoshopでは2014年6月のCC2014(15.0)からになります。Affinityでは2015年7月のバージョン1.4からの対応になります。まあAffinity Designerが登場したのは2014年12月(1.0)ですから、当初から予定されていたものの実装が遅れていたということでしょう。なお、バージョン1.4の時点ではWindows版はまだベータ版だったので、Windowsの正式版でいうと“最初から搭載されてた”といえます。
この3つのアプリケーションのアートボードを比較すると大きな構造の違いがあります。それは「レイヤーパネルに表示されるかどうか」というものです。
Illustratorはレイヤーパネルには表示されませんので、レイヤーとアートボードは無関係です。レイヤーパネルが垂直方向の重なりを表現するものとすると、アートボードは水平への広がりになります。(図はAffinityの等角投影で作ってます)
レイヤーパネルに表示されませんから、別途アートボードパネルがあります。アートボードは重ねることができ、重なった両方のアートボード上にあるオブジェクトは両方のアートボードに含まれます。下の図は以前の記事の図ですが、アートボードを3枚重ねています。印刷したりPDFにすると3ページとなり、2ページ目(アートボード2)と3ページ目(アートボード3)の内容は1ページ目(アートボード1)に含まれます。アートボード2、アートボード3内にあるオブジェクトはアートボード1内にもある、ということですね。
これに対してPhotoshopとAffinityでは、アートボードはレイヤーパネルに表示されます。左はPhotoshopのレイヤーパネル、右(黒いほう)はAffinityのレイヤーパネルです。レイヤーパネルに表示されるということは、つまりレイヤーなのですよ。
同じですね。つまり、アートボードはレイヤーと同一の扱いなので、Illustratorのようなレイヤーとアートボードが水平垂直にクロスするというイメージにはなりません。アートボードごとにレイヤーが完全分離されることになります。
そのためオブジェクトは複数のアートボードに属することはできません。Illustratorのようにアートボードを重ねても、両方のアートボードに表示されるオブジェクトというのは存在できません。ただし、「どのアートボードにも属さない」レイヤーを作ることはできます。
そしてもうひとつ特徴的なのが、「アートボードはクリッピングマスクである」ということです。つまりベクター図形と同じ属性を持っています(特にAffinityはベクター図形そのものといえます。後述)。そのためオブジェクトの一部がアートボードの外に出たら、そこはクリッピングマスクの機能によって見えなくなります。頑張って図の中に入れてみたのがアートボード3の赤い円です。Illustratorでは円全体が表示されますが、PhotoshopおよびAffinityではアートボードからはみ出た部分は表示されません。
Illustratorに慣れている人はここ(アートボードからはみ出た部分が表示されない)が戸惑うポイントのひとつです。時折このことでAffinityに文句を言う人がいるんですが、だったらPhotoshopにも文句を言え、という話ですね。
そういうわけで、同じ「アートボード」という名称であってもIllustratorとPhotoshopやAffinityとは仕組みが全然違うわけです。そのためIllustratorのアートボードは1000までという制限(CC2017までは100)がありますが、PhotoshopやAffinityの仕組みでは制限を設ける理由がないというのがわかると思います(実際の上限はあるんでしょうが、意識させられることはない)。
またAffinityとPhotoshopのレイヤーはそもそも、ラスター画像(ピクセル)を重ね掛けするための機能なので、アートボードもそれに従えば同じ構造にならざるを得ないということになります。これに対してIllustratorのレイヤーは単なるグループなので構造上の意味は特にありません。
私が何回もAffinityとIllustratorを比較して解説するのはここに理由があります。今月に入って最初に書いた記事(Affinityの黒矢印は「選択ツール」じゃありません!)でもあるように、AffinityはPhotoshopとかなり近いです。だからPhotoshopユーザーは迷うところが非常に少ない。それに比べてIllustratorは発想が全く別なので、IllustratorからAffinityに移行しようとするとかなり戸惑うのです。
一方、IllustratorやAffinityにあって、Photoshopにないものがあります。それは裁ち落とし(Bleed)です。まあ、これはアプリケーションの性質上、仕方のない部分と言えるでしょう。
まとめるとAffinityのアートボードは次の性質があります。
- 閉じた図形である
- クリッピングマスクである
- 裁ち落としがある
- マージンがある(Illustratorにはない)
そのためレイヤーパネルを見るとクリッピングマスクと変わらないように見えます。レイヤー左端のアイコンだけが頼りです。

最後に、Affinityならではのアートボード機能を紹介して終わります。それは「閉じた図形であれば何でもアートボードになる」ということです。IllustratorもPhotoshopもアートボードの形は長方形です。しかしAffinityは円でもアートボードになります。
この柔軟性がAffinityです! 円形のアートボードは缶バッジやコースターをデザインするのに都合がよい(かもしれません。やったことないので)。また、長方形であっても角に丸みを持たせたりできます(何人か角丸の名刺を頂いています)。
これは便利か? 長3封筒展開デザイン用アートボード。
こんな風に好きな形のアートボードを作って楽しめます。
ただし裁ち落としとマージンが長方形にしかならないのが残念。PDFに書き出そうとするとこうなります。
裁ち落としを含めない場合
裁ち落としを含める場合
このあたりをうまく処理(裁ち落とし幅を13mmとかにしてアートボード外にトンボを描く? アートボード外に白を置いておく?)できれば、Affinityの自由形アートボードはかなり使えると思うのですが、あとは現場の皆さんにしかできないのでそこはお任せします。









