1Photoshopを使った点線・破線の作り方をおさらいします。私がWebサイトを作り始めた頃はPhotoshopで破線を作るのは面倒だった記憶があるのですが(どれだけ昔...)、シェイプツールの機能が大分進化してきたので、今は簡単に作ることができます。以下の画像のような破線をペンツールやシェイプツールで作成します。ペンツールやシェイプツールはパスで図形が作られるので、Illustratorのベクターのようにサイズを拡大・縮小しても画像が荒れません。レスポンシブサイトでサイズの違う画像を作成する時などにもオススメです。左のツールパレットで「ペンツール」を選び、ウィンドウ上部のオプションバーで「シェイプ」、塗りは「なし」に設定します。適当な太さで一本線を引きます。画像では太さを2pxに設定しました。「線オプション」をクリックすると、既に登録されている破線が出てきます。この中から選んで調整してもよし、自分で0から作るのもよし。「線オプション」パネル下部にある「詳細オプション」をクリックすると、破線の長さや間隔を設定することができます。この辺りはIllustratorと同じですね。自作した線は保存して再利用できます。歯車アイコンをクリックするとメニューが出てきます。上記はオプションバーから作成しましたが、左図の「属性パネル」からも作成可能です。ブラシを使う方法Photoshopのブラシを使うと、丸い点線のみならず、様々な形や色の変化を加えた罫線を作ることができます。「ハード円ブラシ」を選択します。サンプルでは直径12pxに設定しました。「間隔」を100%以上に設定するとブラシが点状になり、間隔が開くようになります。ブラシの形状やサイズを変えれば、様々なデザインの罫線が作れます。パスを作成して、パスのパネルから「パスの境界線を描く」で選択中のブラシを指定すれば、図形の線にも適用可能です。上記のブラシでの破線の作成方法を応用して、手書き風のちょっと動きのあるかわいい罫線を作ってみます。「描点ごとに適用」にチェック明るさのジッター:20%「カラー」の「色相のジッター」で簡単に色を変えることができます。ブラシの直径で太さを変えたり、「散布」でより動きのある配置にしたりと、色々試してみると面白いです。作ったブラシを登録する作ったブラシを別のファイルでも再び使えるように、ブラシプリセットとして登録しておくと便利です。ブラシパネルの右上のメニュー(画像1)をクリックして「新規ブラシプリセット...」を選択し、名前を付けて保存します。ブラシパネル下部にあるアイコン(2)をクリックするとプリセットマネジャーが開くので、保存したいブラシを選択して「セットを保存」(3)すると、.abrファイルが書き出されます。ブラシを使いたい時にこの.abrファイルを読み込めば、いつでもブラシを使えます!ブラシを見やすく、使いやすく管理してくれるプラグインもおすすめです。私もこのプラグイン使っていますが、ブラシ管理がとても楽になりました。上記の作例は以下の本を参考にさせていただきました。点線・破線以外にも、手書き/手描き風のデザインの作り方がたくさん載っています。これ一冊でデザインの幅が広がります。Pencil対応のiPadとお絵かきアプリがあれば、手書き風のブラシで簡単に絵を描いたりデザインを作成したりできます。Sketchは、デスクトップ版で使用しているブラシが読み込めたり、他のアプリでもブラシを自作したりすることもできます。PhotoshopやProcreateのように、PSDファイルを読み込めるアプリもありますので、デスクトップと作業を共有することも可能です。iPadのお絵かきアプリは、以下の記事でたくさん紹介しています。Photoshop】iPadの選び方や便利な活用方法については、以下の記事をご参考ください。【書評】なるほどデザイン〈目で見て楽しむ新しいデザインの本。【Illustrator編】手書き風のラフでランダムなかわいい点線・破線を作る方法AboutフリーランスのWebデザイナーです。Web制作/デザイン/写真に関するメモや、仕事/育児/家事の両立に役立ちそうなことも書けたらと思っています。楽天ROOMやってます。reserved...。