デザイン

Photoshop初心者でも簡単!被写体の切り抜き方法

こんにちは、ハヤマです。 今回は、Photoshopでのスピーディーな被写体の切り抜き方法についてご紹介します。 切り抜きは作業頻度が何かと高いと思いますので、デザイナーの方以外でも、Photoshopをお持ちでしたら覚えておくと損はないかと思います! はじめ…

文字組みの救世主!合成フォントの代用にもなる便利なIllustratorスクリプト

こんにちは、ハヤマです。 今回は、Illustratorで使用できる便利なスクリプトをご紹介します。 数字だけ大きくしたり、 英字だけ選択したりするスクリプト 例えばですが、タイトルやキャッチコピー、日付、金額表示などの文字組みを行う時のことをイメージし…

新しいフォントのカタチ「バリアブルフォント」とは

こんにちは、ハヤマです。 今回は、少しずつ普及し始めている「バリアブルフォント」について学んでいきたいと思います。 バリアブルフォントとは? Adobe・Apple・Google・Microsoftが共同で開発した新しいフォントの概念のことで、通常、フォントファイル…

感謝!無料&商用可能なフリーアイコンサイト5選

こんにちは、ハヤマです。 デザインを行う上で、情報を直感的に表現したり、装飾のアクセントとして配置したりと活用頻度の高いアイコン。 今回は、汎用性のあるシンプルアイコンやフラットデザインアイコンのほか、ジェネレートタイプやドット絵といった変…

AIが手書き文字からフォントを作成!?「AI JIMOJI」が面白い

こんにちは、ハヤマです。 2022年1月23日に、フォントメーカーのフォントワークス株式会社が「MOJICITY(もじシティ)」というサイトを公開しました。 テーマは“「自分らしいフォントを自由に楽しめる世界をつくる」ために生まれた実験仮想都市”。こちらでは…

[Webデザイン]カラープロファイルの埋め込みに気をつけよう!

こんにちは、ハヤマです。 デザインデータをもとにコーディングを行った際、カラーコードなどの値はデータに忠実に作成しているのに、「デザインデータと色味が違う」となってしまったことはありませんか? それ、デザインデータの共有時に大事な情報を共有…

イラレでWebデザイン!ことはじめ 〜設定編〜

こんにちは、ハヤマです。 今回は、Illustratorを使ってWebデザインを行う際のアプリケーション設定についてご紹介します。 はじめに 個人的に、IllustratorでWebデザインを行う方というのはDTP出身のデザイナーさんに多いのではないかなと思っています(か…

ヒグチユウコさんファン必見!アドビオリジナル日本語フォント「ヒグミン」新登場!!

こんにちは、ハヤマです。 今回は、個人的にとてつもなくテンションが上がってしまった「ヒグミン」というフォントについてご紹介します。 「ヒグミン」とは 「ヒグミン」とは、画家のヒグチユウコさんによる手書き文字を基に、アドビのプリンシパルデザイナ…

Adobe XDで「パスのアウトライン化」を使ってみよう!

こんにちは、ハヤマです。 普段はPhotoshopでWebデザインを行うことが多いですが、 履修を兼ね、気になった情報を随時記事にまとめていきたいと思います。 はじめに さて今回は、Adobe XDでパスのアウトラインを取る方法についてご紹介します。 2021年6月、…

【Google Fonts】2021年8月末、日本語フォントが新たに追加!

こんにちは、ハヤマです。 8月26日、Google Fontsに8つのフォントが加わりました。 Google Fonts News! New fontsGlory, Azeret Mono, Alumni Sans, Urbanist, Allison, Besley, Klee, Kaisei. Upgraded fontsIBM Plex, Kumbh Sans, Work Sans, Mulish, Rut…

Adobe XDの作業をスピードアップ!〜後編(スタックについて)〜

こんにちは、ハヤマです。 本日は、前回の記事の続きとして、Adobe XDの機能「スタック」についてご紹介したいと思います。 前回の記事はこちら tech.arms-soft.co.jp スタックとは スタックを使うと、以下の操作を簡単に行うことができます。 要素の横並び…

Adobe XDの作業をスピードアップ!〜前編〜

こんにちは、ハヤマです。 今回は、Adobe XDで作業をする際スピーディーに作業するためのポイントをご紹介していきたいと思います。 プラグインを活用しよう プラグインは、用途に合ったものが見つかると作業効率が格段にアップするのでどんどん活用していき…

これから流行るかも?CSSの新しいデザイン手法「ニューモーフィズム」でボタンを作成してみる

こんにちは、ユアサです。 いよいよ梅雨入りしてジメジメした日が続きますね。 さて今回は、昨年にCSSのトレンドになるのではと話題になっていた「ニューモーフィズム」について紹介していきます。 ニューモーフィズムについて ニューモーフィズムは、「New…

Photoshopデザイン効率化の道 〜ショートカットの活用〜

こんにちは、ハヤマです。 突然ですが、皆さんは操作をするときにどれだけショートカットを活用されていますか? 本記事では、“たかがショートカット、されどショートカット”として、 Photoshopでデザインを行う際に活用すべきショートカットについて、おす…

Photoshopで綺麗なデザインデータを作ろう!:「CCライブラリ」を活用編

こんにちは、ハヤマです。 今回は、PhotoshopのAdobe Creative Cloudライブラリ(以下、CCライブラリ)を活用した、Webデザインのデータ作りについてご紹介します。 CCライブラリとは Adobe CCのアカウント全体で共有使用できるデザインエレメントの保存ツー…

使う場合はココに注意!サイドバーのあるWebサイトデザイン

こんにちは、ハヤマです。 今回は、サイドバーのあるWebサイトデザインについて、メリット・デメリットや、コーディングを始める前にデザインの時点で考えておくべき点をまとめていきたいと思います。 サイドバーとは メインコンテンツの横(右・左)にある…

[GoogleFonts]分析データ結果から新たなフォントを開拓:7選

こんにちは、ハヤマです。 前回はGoogleFontsの年間ランキングについて記事を書きました。 tech.arms-soft.co.jp 今回もGoogleFontsのフォントについて調べてみたいことがあったので書いていきたいと思います。 はじめに 前回の記事では、上位5位のフォント…

分析データから見る、2020年の人気Google Fontsはこれだ!

こんにちは、ハヤマです。 唐突ですが、もう年末。今年は色々とありましたね。 色々とありすぎて、季節感すら追えていません、、。 そんな状態ですが、せめてブログでは時期に合ったネタ?を紹介したいと思います。 はじめに Webサイトデザイン制作において…

Webデザインの色を忠実に!カラーマネジメントを理解しよう

こんにちは、ハヤマです。 ストックフォトサービスを提供する「Shutterstock」から、2021年のカラートレンドが発表されました。 選ばれた3色ですが、上品だけれども生命力を感じるナチュラルカラーで、個人的にも好きな配色です。 詳しくはこちら。(英語サ…

[Adobe MAX 2020]Adobe XDに興味があるPhotoshop使いのWebデザイナーにおすすめ!なセッション

こんにちは、ハヤマです。 先週、「Adobe MAX 2020」が開催されましたね。 今年はコロナ禍もありオンラインでの開催となりました。 今回はこのイベントのコンテンツについてお話ししていきたいと思います。 「Adobe MAX」とは? 「Adobe MAX」は、アドビシス…

Adobe XDでデザイン!プラグインを活用しよう

こんにちは、ハヤマです。 最近、弊社もワイヤーフレーム以外にデザイン制作においてもAdobe XDを用いるようになりました。 Adobe XDのメリットはなんといってもデータの軽さではないでしょうか。 配置画像をどんなに拡大・縮小しても画像自体に劣化が発生し…

文字化けPDFをIllustrator上でアウトライン化する方法を試してみた

こんにちは、ハヤマです。 購読している「Adobe Blog」にて、Illustratorの操作で参考になった記事(動画)を見つけたので紹介したいと思います。 記事について 記事はこちら。 blogs.adobe.com ゲストである博報堂プロダクツの河和田将宏さんが、Illustrato…

Photoshopでウェブデザイン!データ作成のポイント

こんにちは、ハヤマです。 今回は、ウェブデザインのデータをAdobe Photoshopで作成する際、データの作りとして気をつけていることをまとめていきたいと思います。 その1:レイヤー名はわかりやすく ページボリュームが多くなると、モジュールやセクション、…

入力フォームをデザインする時に気をつけること

こんにちは、ハヤマです。 最近、お問い合わせなどのフォームのデザインを行う機会が多かったので、制作時に気をつけるべきことや、気づいたことについてまとめていきたいと思います。 入力内容に合わせて幅を設定する 全てを領域の幅いっぱいまで広げる必要…

デザイン共有ツールZeplinとPhotoshopを連携して、デザイナーとエンジニアの効率をアップしよう

こんにちは、ハヤマです。 今回は、デザイナーとエンジニアの相互の効率を図るためのアイデアを探している時に見つけた「Zeplin」というツールをご紹介します。 Zeplinとは Zeplinの特徴 デザインを構成する情報を確認・取得できる デザインデータに対してコ…

共同編集におすすめ!プロトタイピングツール「Figma」とは?

こんにちは、ハヤマです。 先日、社内SNSにて話題に上がったこちらの記事。 www.itmedia.co.jp 東京都が3月4日に開設した「東京都 新型コロナウイルス対策サイト」。 コロナウイルスに関連するデータ(陽性患者数、検査実施数、相談件数他、相談窓口情報など…

Adobe XD アップデートで新登場!「コンテンツに応じたレイアウト」とは?

こんにちは、ハヤマです。 突然ですが、少しだけ宣伝です。 先日、アームズの公式Instagramを開設しました! 今後こちらのアカウントでアームズの最新情報などを(時にはゆる〜く)発信していきたいと思っています。 ぜひぜひ覗いてみてくださいね。 https:/…

Photoshopの段落スタイル&文字スタイルでテキストデザインを統一しよう

こんにちは、ハヤマです。 若干時間が空いてしまいましたが、今月頭に開催されたAdobe MAX Japan 2019。アーカイブから業務に関連しそうな動画を少しずつ視聴しているのですが、「Adobe capture」でついに撮影画像からカラーでのベクターデータ変換ができる…

Adobeユーザー歴=嵐の活動年数の私がSketchを試してみた

芸術の秋。静岡県三島市にある佐野美術館で開催中のヒグチユウコ展を観に行きました。人の手による緻密で可愛くも不思議な世界観に圧倒され、気付けば散財してしまいました。しばらくは画集を眺めて過ごすハヤマです、こんにちは。 はじめに 突然ですが、私…

ちょっとの意識でふぉんとに違う!〜 行送り・トラッキング数値の計算編 〜

先日の台風、凄まじかったですね。 被害に遭われた皆様に、謹んで心よりお見舞い申し上げます。 『備え』について、改めて考えさせられたハヤマです、こんにちは。 今回はデザインデータで設定されている「行送り」「トラッキング」をCSSで指定する際の計算…