またお願いしたいんやけど、ウチ名刺新しくしたいんよ。
そうですね、ちまたではそろそろ年度が変わりますしね。
やっぱりAdobeのIllustratorとか使うん?
Adobe Expressでできますよ!
新年度、就職、転職、昇進、起業など、いわゆる節目、状況が変わるタイミングがありますね。
そういう時、名刺文化が強い日本では、新しい名刺を渡してご挨拶したいのでは?
最近ではそういったビジネス的な使い方だけでなく、
SNSで知り合った人と会う時にも名刺交換をするというシーンも見かけました。
会社員の方なら名刺は会社が用意してくれますが、個人あるいはお店の名刺だと印刷会社に頼むほどの量にはならない…かもしれません。
また、名刺が自分の「できるコト・想い・イメージ」などを伝えるツールだとすれば、自作してみたくなりませんか?
「でもデザインしたコトも、デザインアプリも使ったコトないから…」
とあきらめているアナタ!
このブログでご紹介している Adobe Express なら、そういった経験の無い方でも名刺のデザインが可能です!
Adobe Expressアンバサダー&デザイン講師ブロガーのセッジです!
今回はAdobe Expressを使った名刺デザイン方法を解説します!
チュウヤンともうします~!
今日は名刺作りちゅうことで、楽しみにしとります!
※この記事はアドビ社およびAdobe Expressのプロモーションが含まれています。
Adobe Express公式サイト
名刺の要素を決めよう!
名刺に入れる要素を決めましょうか。
名前とか、連絡先とかやろか?
名刺のサイズは小さいので入れられる要素は限られますが、思いつく限り挙げてみましょう。
- 名前
- 肩書き
- ロゴマーク(企業などの場合)
- イラストや自画像
- 連絡先
- SNSアカウント
- Webサイト
- 自己紹介
- QRコード
などなどです。
さすがに全部入れられませんので、今回は、
名前(今回は店名兼ねる)・肩書き(サービス名)・自画像・連絡先・SNSアカウント・QRコードといった要素を入れるコトにしました。
個人の名刺の場合は連絡先に住所は入れないほうが良いでしょう。
初めて会う相手の場合はトラブルの元になるかもしれませんしね。
Adobe Expressでテンプレートを選ぶ
さっそく名刺を…ってホームにないんやけど?
Adobe Expressのホーム画面には、SNSやポスターなどのサイズがあらかじめ用意されていますが、名刺は見当たりません。
しかし、用意されていないというわけではありません。
検索ボックスに「名刺」と打ち込んでみましょう。
たくさんの種類の名刺のテンプレートが表示されます。
今回はこの中から女性の写真が入ったシンプルな名刺テンプレートを選択しました。
デザインしたあとで名刺サイズが違っていても困るので、サイズ変更ボタンを押してサイズを確認してみます。
確認したところ91x55mmでした。
これは「4号」といわれる一般的な名刺サイズで、10枚つづりの名刺用紙などにも対応できるサイズです。
サイズ変更は、Adobe Expressプレミアム版でのみ使える機能ですが、このテンプレートを使用してもらえれば無料版でも4号サイズで作成できます。
※印刷会社に発注する場合は、印刷ルールに従った作り方が必要になります。
![Adobe Express:名刺テンプレートと名刺サイズ Adobe Express:名刺テンプレートと名刺サイズ](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiRzdkh2L9H6e7TPqmvYog5mNQEIR0BbkLDn4o4pFzjhwU52Gj2OD7riANi_GTZflt2M6phCJN4ncghd1AAB8CSplYB6UGH3TN3Zsc2Vj94NSny7LPNAet4tiehQCUqsoQHtxgJARrOPvr1N1spfF14W9xD9P0eX3K0NJ51aD011jGtBqO_rKFXuCM1OQ/w640-h360/namecard001.jpg)
文字情報を置き換えよう!
さきほど選んだテンプレートを変更していきましょう。
ここでは肩書部分をサービス内容、名前をチュウヤンさんに、所在地も書き換えています。
チュウヤンさんはWebサイトを持っていませんので、そこはInstagramアカウントにしておきました。
![文字情報の打ち替え 文字情報の打ち替え](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7faRTH4atE6_FlgOIgi98CjtuvC0ZL3HaOt8a9Vmy94JjtRKXnD7T2ML1b0UPCbvK_kDa3XnRRLFznfcgBA6vsKwLp_u5DXlgqu8zaGpXeryoB4qex52gJ56nPi8YLRQbgTMWVqu7L97BOusFx7r8DY8WviwGUnAyxHcxkt4_EMLXPVOULOf5bmsRyw/w640-h360/namecard002.jpg)
MOBILEやInstagramなどを文字の代わりにマークにするという方法もあります。
置き換えたい文字は消しておきましょう。
左側のツールパネルから「シェイプ」を選び「Mobile」「Instagram」などで検索します。
なんとなくそれとイメージさせるマークが出てきますので、イメージしやすいマークを選んで配置してみてください。
![文字列のかわりにマークで表現する方法 文字列のかわりにマークで表現する方法](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi19Uram7YCEO2EjtY8FMuhLT1wzJCfJmytg2Y313FRGT556LesRZpSySE5nzcKNDIU2yEUAaDTfQSjk8jSdsNcSjMlbOkSPd5WBWhoqGgjsm821uIhMvuZOW3gI5UCIKrBHVjiC2IvdFmgxOLP2YkRoLZSrA5OH4Fa46bGODcJ8iXiW-Q_ly43sFxCnA/w640-h360/namecard002b.jpg)
Adobe Stockから素材を選ぶ
ウチはやっぱりコーヒー豆にこだわってるから、豆の香りとかやろか?
さらにカスタマイズしていきましょう。
チュウヤンさんから「豆の香りを感じさせたい」と希望がありましたので、背景にコーヒーやコーヒー豆などの写真素材を配置したいと思います。
実はこのテンプレートは背景がベタ塗り2色で分割されていますので、白色の背景レイヤーを選択して削除します。
![背景削除して写真に置き換え 背景削除して写真に置き換え](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjS_-c5RvHZ_Dxc0hbbjla960RiQ3Lh-BEe21Jy_xfI0KSHicWDwkloaMmv8BKoFPIHyXa43Ni1v_ZigKTtWQu7YRHbLXA0HCEM7lbWMsBLkS6TZi-s3eriCOK9pY8vQvU6MugDAt6I-uN1G1BnR00R6NSRnVgXk5KFdQMMeVDsuSHtKh1iJcWxKFnICQ/w640-h360/namecard003.jpg)
つづいて、残った茶色の背景のレイヤーを選択したあと、右側のタスクパネルの「画像を選択」ボタンを押します。
プレミアム版の写真になってしまいますが、Adobe Expressが使える写真素材集のAdobe Stockに今回の背景のイメージになりそうな写真素材がありました。
こちらを使用します。
![背景削除して写真に置き換え2 背景削除して写真に置き換え2](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEMMsQ3RsE7hC8kdikZYuBfQqpQsvs3aQJx12GiT8og197IbybAAVbe9sD8SbSH_nAE_ZSQCnMNGHLbS5fK3chVl27L574CcJYPgxIE5GGjsyY9lJO-O21AbG2y5d1p7b2wCPjDp7aKIc5MW-8vB5pP51rxN3uCCEACWxi2Yr8r74gm_h_WFs6f6j5Kg/w640-h360/namecard005.jpg)
これで背景が置き換わりました。
もともとテンプレートでは背景が白かったため、文字はグレーだったのですが、
全体が濃い茶系の色になりましたので、文字色は白に変更しています。
![背景削除して写真に置き換え3 背景削除して写真に置き換え3](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYGFY3hHdtD3LjpDv8cwNjbLM_wBcuiFqnNMNlT9hfsIHg2wgMbeh6-4SgPNSf0JmjPJGcL6KmeCySH8wLulRSYt5AocyVUmMSXSITW8aySMroUq07JqnkUu1PzL6K2G2e2EqUXTHehMI460YLbjOZHOzqZdMjdI7LIog73EF4y28UCunWoJjhS1ZY-Q/w640-h360/namecard006.jpg)
自画像の置き換え
でもまだウチの名刺じゃないんよな~
女性の写真を選択し、右側のタスクパネルで「置き換え」ボタンを押します。
ここでいつもなら写真などの素材を検索しますが、今回はオリジナルのイラスト画像を使用します。
![自画像の置き換え・調整1 自画像の置き換え・調整1](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh9fHLQ-OSxRaNHekMe_vBcb56hN_3IGhpOARYpBONo2DzDCz8SWymFepoc6TLLKlSCHW3VBY1kuJ2IkAQ_BVl5LzgvwxLVkIk8mdmEe7LrsaepXIBbzpwVtAMd0IDW4XHF2WgxLvFJgv0Z0qoKLtlUO66WzA-htwKiHp8z5I1BgG7GGUQnGxgmtW_l3Q/w640-h360/namecard007.jpg)
ここでPCのファイル選択ウインドウでチュウヤンさんの自画像を選ぶと…
![自画像の置き換え・調整2 自画像の置き換え・調整2](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhnz34klT7A4xw1lrwn7aPTEpO8-BiZ3ALqvv8VWo-GhVXQDOA7K-WGXF4-6BUHbdbssgZ2_BOpChvyEgK6qxkPe9BjdWqlewozfPAxVtXmDvMNdiIdjqh5Lvp964UcqDibR4F27HH9yYZSsYKlLtmN5b9muug0jFTUaJYTU6HJlegcMTGATMqdIxSmBQ/w640-h360/namecard008.jpg)
ここで「切り抜き&シェイプ機能」を使えば、切り抜き範囲を変更してウェストショットにできます。
![自画像の置き換え・調整3 自画像の置き換え・調整3](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTRP5lN8sPVH1fLyg50-0VC52WxQykyBv4pJ2gYfSOvDE__AAgA1qtJ1V8qxD-fNGpPQpJjkseSGKAHg52czVFQZRcCqvLkh3tsVAl1KirtLLvCsc7KSgjt40xh7NMNqHMLmyA7YDlSnrqn7VTYK8UNL-813C3wHyWsMRXJFJjbsjdJUZeFXBqoCE5-g/w640-h268/namecard009.jpg)
Adobe ExpressでQRコードを生成する方法
なので、QRコードを作って貼りましょう。
最近、Adobe ExpressにQRコード作成機能が追加されました。
まずQRコード化したいリンク文字列をコピーしておきましょう(今回はこのサイトのリンクを使っています)。
Adobe
Expressホーム画面の「クイックアクションを試す」で「QRコード」に切り替え、
「QRコードを生成」ボタンをクリックします。
![QRコードを生成1 QRコードを生成1](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0keYzS9tZOXZOYgpeo0UlpcYYADWxZo0go_-9y2A4V45kY3Vwhv58mQzaLBFt5BV0-LVMk0XJ6lnXQ_PmTq17gbcOW2dnfLaHmiZS0iDobanuTnK9_m22HPDqaX1bZVpD6Tzhrj9AJLmvkmMKIDa6nrC_7DnkpAtzAzxjIJOa53UH6fdipEjD0rKq7Q/w640-h360/namecard010.jpg)
するとQRコード生成画面になります。
ここでコピーしておいたリンク文字列をペーストして「QRコードを生成」ボタンをクリックしましょう。
生成されたQRコードはPNG・JPG・SVGのファイル形式が選べますので、好みの形式を選んでダウンロードします。
![QRコードを生成2 QRコードを生成2](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgfFnWHC_CAOGevkMZiTwMcWjs6Ju_yapSq0a9w3NR4ma3eRkILds5cswQF14iyjKggTkcHz0sQIAPrN6OC7aTPQ9NxxKCLS8LGEce2N9NTCCyypMaPQGJSNkZYhabGDZtk3e9QuYXctpYhJKSg6WbfuO-q854BuFoHY_vO_G8ALb2r8x7ofDnuT8XyFw/w640-h360/namecard011.jpg)
ちなみに、QRコード自体は無料で使用できます。
しかし「QRコード」という名称を使う場合は「QRコードは(株)デンソーウェーブの登録商標です。」という文言が必要になります。
特に何も書かないか、誘導したいモノ・コト(SNSやサイト、サービスなど)の名称を書いておくと良いでしょう。
名刺のデザインを完成させよう!
そろった要素を配置して完成させていきましょう。
とはいえ、テンプレートをカスタマイズしているので、大まかな配置はできています。
さきほどダウンロードしたQRコードを「写真」→「写真をアップロード」で読み込みます。
サイズと位置を調整しますが、Adobe
Expressで生成されたQRコードは余白が少ない感じがします。
この余白は「クワイエットゾーン」と呼ばれ、この余白が少ないとキチンとコードが読み込めないおそれがあります。
四角いシェイプなどをコードの後ろに配置して余白をとっておきましょう。
正確にはこのコードの場合は4セル分以上必要になりますが、図の程度に余白をとれば良いでしょう。
![クワイエットゾーンの作成 クワイエットゾーンの作成](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMJGTwmroG_2ymOGwpu49UVMqBjMsOWziBU--_GKSOx8iQDWF0W8emet-1NfvdUMWg2xyFk3wbTAqt67S8suUHvg9jLsYBDHRl9WD3orVrJWbdyojERhV9PgKlZkjg2_rQmUi3SNwWC6J0OSBvNrMd4M9L08eB1je6nflzj2ThUjJeHEWckb1bptipmQ/w640-h360/namecard012.jpg)
もうちょいコードをスキャンしたくなるようにしたいんだけど、何かお客さんにサービスとかできませんか?
ということで、Instagramにアクセスしてもらいやすくなるように、QRコードに文言を足して完成です…!
![QRコードに誘導する文言の追加 QRコードに誘導する文言の追加](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwVwAL3XmI7o9M_RZslC2TQnoGg4R-sDRCP-I0HCuUUwDeO-FA4yMEJsznJ6BXEIOOPr5Lw1NvrxuS2eXpsP9oReFXYkq8wK4nv3XP9ZNQplNKop_u_a5Q_H5KR-9qfmBeCY4sOZh8kuARnr6OlyZICm1l3QT8acviz65wLTK8Zv2M4p1hP_1Y8WjPJQ/w640-h360/namecard013.jpg)
できあがった名刺をSNS用にアレンジしよう!
できあがった名刺は、紙にプリントする以外にもSNS用の画像、ソーシャルメディアグラフィックにするコトも可能です。
「複数ページ機能」を使って、名刺を複製してサイズ変更機能をつかえば、InstagramやTwitter用の画像サイズにするコトができます。
代表的なSNSのサイズが用意されているので便利です。
プレミアム版でないとサイズ変更機能は使えませんが、現在30日間のプレミアム版無料体験ができます。
ぜひ試してみてください。
![複数ページ機能でSNS用にも調整 複数ページ機能でSNS用にも調整](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXVlpGnOeixkcoKM710aYv5sjleDQkfxxbUX-8RjBXSFjQg2_Jfb4bIiz1Y8KCKs1q0JKu4VFu4EXf65caVuo75c2uZtwCgVRbdayDXnuTteFsmzbWfzpf9pYJxKErtR0YR_X82h5Y9ayArTGhHbRM9SQ2wpTmKDiKLhUTUUNNNqW9GNAEvde-5t7wKg/w640-h360/namecard014.jpg)
名刺をプリントする方法
この名刺、どうやってプリントすればえぇの?
オススメはPDFですね!
現時点でのAdobe Expressは直接プリントするコトができないため、画像ファイルとしてダウンロードする必要があります。
今回オススメしたPDF(Portable Document Format)とは、
異なるPCやOS間や、同じアプリケーションソフトを所有していなくても、閲覧・プリントができるようAdobe社が生み出した形式です。
なぜPNGやJPGではなく、PDFがオススメなのかというのは単位の違いにあります。
PNGやJPGの単位はPixelです。
それに対してPDFはPixel単位だけでなく、物理的な単位(mmなど)にもできます。
今回のように最終的にはプリントする場合は物理的な単位が必須です。
![PDFにしてプリントする方法 PDFにしてプリントする方法](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjqqsMLGqNLh6aVFzjWxso5IMWBuSFooGyVv-uFjemy24jK1eGpAn18MNE3VNNoSK5p-HxWYOc_k2mqLFTO4QpLK2sl4JQu5rRqSPAcrfWcqPZadseXjPeDF4bRBqs5FXGfa4DnWG8Ielnmeq5vnTI7F-xHmdHkFVHvp-TZAV0kUaVsp8_78ftoikUa9g/w640-h360/namecard015.jpg)
ダウンロードしたPDFは、無料のAcrobat Readerで開くコトができます。
そして、この状態からプリントするコトができます。
試しにプリントしてみましたが、きちんと91x55mmになっていました。
Adobe Expressでデザインしたモノをプリントするならば、Acrobat Readerもセットで使うと良いでしょう。
![PDFにしてプリントする方法2 PDFにしてプリントする方法2](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrxjIQoIYPAQbMPsd9w5udrVuzQnZ3QnqRX7bHQe7BPaJ5llAgtyfEH971JPy4zUotQIreRKQQ2BG398nJykwxHYpiU1HOK9sq2fEvfExGbmr9mj4uFF3LVKcqZFN67C105GBRqCyd_8Pq0pM1B6bTrNaAYSzSus3wC9joRklaDuB_3zP7hwqZ9vw6tA/w640-h360/namecard016.jpg)
Adobe Expressの使い方:名刺をデザインする方法!
今回はAdobe Expressを使った「名刺をデザインする方法」について解説しました。
名刺をデザインするには、
- 名刺の要素のまとめ
- 名刺全体から感じるイメージ
- 名刺画面のレイアウト
などが必要ですが、
このうち名刺全体から感じるイメージはAdobe Expressの素材集・Adobe Stockから選択できます。
基本的なレイアウトについてはテンプレートを選択することで、デザインにおけるベースをあらかじめ用意するコトができます。
「名刺はデザインの基本がすべて詰まっている」
といわれるコトも多いので、ぜひAdobe Expressを使った名刺づくりにチャレンジしてみてください!
Adobe Express公式サイト
Adobe Expressでデザイン!えぇと思うわ~
名刺はある意味であなたの想いやできるコトを最初に伝えるツールともいえるので、ぜひ楽しみながら作ってみてください!
いろんな人の名刺デザイン、見てみたいわ~
よかったらTwitterやInstagramなどでメンションして貰えれば、あなたの作品を拝見させていただきます!
また他の記事やSNSでもお会いしましょう!
セッジへのメンションお待ちしています!
RT・いいね、可能なときはコメントさせていただきます!
![プロフィールWebページを作ろう!:Adobe Expressの使い方](https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQatrRLjYKa4IA4FtF_o_DVAug7WNsianazWFE3DSQblax1Pr60ZQ_5yijgrCf6_RtToxtZDOkElBTdvY-STXNunAykxKyPCGCn2gqf7AVvAou-OkdSv1JTm4vNf_wWxDrucJD6Hx7GBpJcvsQceqmft8GIB_KpW7nUQYy_Vf7pF8GV2j0Wk5WRq05oA/w200-h105/Adobe_CC_Title_08.jpg)
プロフィールWebページを作ろう!:Adobe Expressの使い方
Adobe ExpressでプロフィールWebページを作りましょう。 「自分を知ってもらう」というのは活動していく上でとても重要ですが、なかなか難しいです。そこでオススメしたいのがWebでプロフィールページを作るコト。 Adobe ExpressならWebの知識がなくても作成が可能です!
コメント