最新記事

デザインシステムとは？ デザインシステムとは、ブランドと顧客のタッチポイントにおけるデザイン表現をルールやコンポーネントとして再利用可能な形で体系化したドキュメントで、一貫性を持ったブランド表現を提供するために用いられます。 デザインシステムには、デザイン原則、スタイルガイド、デザインコンポーネントなどが含まれ、包括的にブランドのデザイン表現を定義したものとなります。 また、デザインシステムは組織のデザイン文化そのものを示すものでもあります。プロダクトに関わるすべてのメンバー

モックアップ素材専門のサイト この記事では、プレゼンテーションやApp Store画像、SNS投稿などで役立つモックアップ画像作成用の素材配布サイトをまとめました。 素材サイトの選定基準としては以下の通りです。 商用利用可能 クレジット表記不要 Appleデバイス素材の取り扱いあり また、紹介するモックアップ素材配布サイトは「モックアップ素材専門のサイト」か「総合的なイラスト素材配布サイト」に分けていますので、まずはモックアップ素材専門のサイトから以下4サイトをご紹介します。

Pinterestとは？多彩な使い方ができる画像ブックマークサービス 『Pinterest』は、インターネット上の画像や動画を集め、コレクションとして整理・共有できる画像共有サービスです。Pinterestでは、自分の趣味や関心に合わせて「ボード」と呼ばれるテーマ別のコレクションを作成し、そこに関連する画像や動画を「Pin（ピン）」として保存していきます。ジャンルは、デザイン・ファッション・インテリア・料理・DIYなど、幅広い画像が共有されています。 また、Pinterest

Optimaとは？碑文からデザインされたヒューマニスト・サンセリフ体 Optima（オプティマ）は、ドイツの書体デザイナーHermann Zapf（ヘルマン・ツァップ）によってデザインされ、1958年にリリースされた欧文書体です。ヒューマニスト・サンセリフ体に分類されますが、一般的な”サンセリフ体”とは少し違うイメージを持った人も多いのではないでしょうか。縦線と横線の太さのコントラストや、セリフを示唆するようなエレメントが残っているため、サンセリフ体なのにセリフ体のようなエレ

サービスデザインとは？ サービスデザインとは、顧客に提供するサービス全体の体験をデザインし、改善するプロセスを指します。このアプローチは、顧客が直接触れる製品やサービスだけでなく、店舗のレイアウトやWebサイトの使いやすさ、顧客サポートの質など、関連するすべての接点を考慮に入れます。 また、経済産業省の資料では、サービスデザインの概要を以下のように示しています。 サービスデザインの目的は、顧客にとって価値のある体験を提供し、顧客満足度を向上させ、ロイヤリティを強化をすることで

サービスブループリントとは？サービスの提供フロー全体を可視化するフレームワーク サービスブループリントとは、サービスの提供フローを可視化するフレームワークで、顧客との接点のみならず、サービス提供者側の業務フローやシステムの動きを含めた全体像を把握することができるのが特徴です。 サービスブループリントを用いることで、プロダクトやサービスの問題点を発見しやすくなり、顧客満足度を高めるための改善点を明確にできます。また、チーム内での理解を深められ、各ステークホルダー間の連携をスムー

おすすめの画像素材サイト13選 この記事ではおすすめの写真画像素材を配布する13のサイトをご紹介します。選定基準は以下の通りです。デザイナーも使いやすい高品質・高画質な写真画像を揃えているサイトを厳選していますので、素材探しをしている方はぜひ参考にしてみてください。 無料ダウンロード可能 使いやすいUI 商用利用OK クレジット表記不要 素材加工OK Kaboompics | Netflixにも使用されたことがある高品質な写真が使える 「Kaboompics」は、商業用途を含

インハウスデザイナーとは？ インハウスデザイナーとは、特定の企業や組織に所属し、社内のデザイン業務を担当するデザイナーのことです。広告代理店や制作会社に所属するデザイナーとは異なり、自社のプロダクトやサービスに特化したデザインを行います。 インハウスデザイナーの仕事内容は多岐に渡りますが、主にWebサイトやアプリのUI/UXデザイン、ロゴやバナーなどのグラフィックデザイン、パッケージデザインなどを担当することが一般的です。自社のブランドイメージを統一し、ユーザー体験を向上させ

スクラムとは？ スクラムとは、複雑なプロジェクトを効率的に進めるためのアジャイル開発手法の一つです。短期間のスプリントを中心に構成され、計画からレビューまで一連のプロセスを繰り返し実施します。スクラムの手法は変化に強く柔軟な対応が可能で、チームメンバーの自主性や協働を重視するといった進め方が特徴です。 スクラムを導入することで、実行可能な計画をベースに、定期的なフィードバックを通じて品質の高い成果物を開発・提供することが可能です。またスクラム開発は、工程全体の透明性が高く、プ

QRコード作成ツールを紹介 ネットでQRコード作成ツールを探すとたくさん候補が出てくるかと思いますが、初めて使う方の中には、どれを選べばいいのかわからないという方もいるでしょう。そこでこの記事では、以下の３つの目的別に使いやすいQRコード作成ツールを厳選して紹介します。 安定した動作でとにかく手早くQRコードが作成できる 独自性のあるQRコードを作成するためにデザインをカスタマイズできる 紙媒体でも対応できるようにQRコード発行後もリンク先を動的に変えられる 今回ご紹介するの

今や私たちの働き方の一つの選択肢として定着しつつあるWFH（ワーク・フロム・ホーム）。コロナ禍の始めの頃には、いかに家での仕事を生産性のあるものにできるかと考え、デスクやチェアを新しく買ってみたり、PC周りの環境を整えた人も多いのではないでしょうか？今やWFHに慣れてしまい、家で仕事をすることに何か新しい刺激が欲しいと考える頃かもしれません。 WFHの生活スタイルへの変化を機に、オフィスに出勤すれば無限に飲めたコーヒーを家で飲むためにコーヒーメーカーを買った人もいると思います

デザイナーの転職時やフリーランスでの案件受注などに必要となるポートフォリオ。Webサイトとして公開すれば、多くの人へのアプローチができるほか情報の更新も行いやすくなります。この記事では、デザイナー向けのポートフォリオサイト作成ツールを3つのカテゴリーにわけて、合計10サービスを紹介します。 Webサイト制作ツール | サービス名 | 価格 | 日本語対応 | | --| --| --| | Webflow | 無料プランあり | × | | STUDIO | 無料プランあり

先日、人気ポッドキャストシリーズDecoderに出演したFigmaのCEO、Dylan Field氏が「ソーラーパンク」と呼ばれるコンセプトに言及しました。この聞きなれないソーラーパンクというコンセプトが今後デザイン表現のトレンドになるかもしれません。 このポッドキャストの中で、彼は最近のデザイン表現がネオンやポリゴンといったサイバーパンクの機械的な表現から、より人間的な表現にシフトしていると述べています。これを彼は「ソーラーパンク」と呼び、彼自身の未来に対する楽観的な考えに

検索画面の様子が変わる驚きの隠しコマンド | コマンド名 | 内容 | | --| --| | askew | 検索結果が斜めになる | | do a barrel roll | 画面が360度回転する | | blink html , blink tag | 検索結果に表示されているhtmlやtagの文字列が点滅する | | Festivus | 画面端にアルミのポールが表示される | はじめに、検索画面の様子がガラッと変わる、驚きのコマンドを4つご紹介します。 askew

オススメURL短縮サービスまとめ7選 URLを共有したい時、URLの長さによっては文字数全体が長くなってしまうこともありますよね。そのような時、URL短縮サービスを使うと、スッキリと見栄えが整います。中には、QRコードが作成できたり、クリック数の分析ができたりと、短縮機能以外のサービスが提供されているサービスもあります。 そこでこの記事では、数多くあるURL短縮サービスの中でも、以下のポイントで選定してオススメをご紹介します。 無料で使える UIがシンプルで使いやすい URL

リモートコミュニケーションを円滑にしてくれる「わかりやすい画面収録動画」を簡単に作れる『』を紹介します。Screen Studioで作られた以下の動画では、クリック対象へのズームやクリック操作を明確にするカーソルのアニメーションなどによって、説明がなくてもどのような操作を行なっているかがわかりやすいですよね。 Screen Studioで画面収録を行うと、このような「操作内容をわかりやすくする編集」を自動で行なってくれるため、共有しやすい画面収録動画を簡単に作ることができます

SNSのポストやバナー画像、またはOGP画像の作成時など、突然モックアップ画像が欲しくなる時ってありませんか？時間をかけて取り組める場合は、テンプレートを探してPhotoshopで作ったり、Artboard Studioなどの専用ツールを使ったりすると思います。しかし、あまり時間をかけたくない場合は新しいツールの導入やログインをせずにモックアップ画像が作れると良いですよね。 今回紹介する『Smartmockups』は、無料かつ登録不要でモックアップ画像を自動作成、ダウンロード

高品質なイラスト素材配布サイト18選紹介 この記事では、デザインの世界中のデザイナーに利用されている海外サイトを中心に、商用利用可能な無料で使えるイラスト素材配布サイトをご紹介します。近年のデザイン業務での利用を想定して、選定基準は以下の通りとしました。 WebやUIデザインで使いやすい モダンで視認性が高いデザイン デザインが統一されている また、海外のサイトは素材の入手方法がわかりにくい場合もあります。くわえて、素材を個別にダウンロードできるケースと、一括でダウンロードで

可読性の良いサンセリフ体、グリッド・システム、限られた色数の配色など、わかりやすく読みやすいデザインを作るために取り入れられるこれらの手法は、スイス・スタイルというモダニズムの後期で生まれたデザイン様式が源流となっています。この記事では、特にWebやグラフィックにおいて、現代で私たちが目にするデザインと深く結びついているスイス・スタイルについて紹介します。 スイス・スタイルとは？モダニズムの理念を受けて発展した情報伝達のためのデザイン様式 スイス・スタイルとは、1950年代に

UIデザインやプロトタイプ、またはペルソナシートを制作している時に、「人の顔写真を使いたいけど、権利的に問題のない写真を探すのが大変だし、自分の写真を使うのはちょっと...」という場面はよくありますよね。 『UI Faces』はその名の通り、UI上で使用することを想定したダミーのアバター用顔写真を提供しているWebサイトです。すべての画像がAI生成されているため、写真の人物は実在せず肖像権の問題を気にせず使えることが大きな利点です。UI Facesに掲載されているAI生成画像

いつも通りGoogleマップで道順を見ようとすると、画面の左下が何やら動いている？どうやら以前発表された「イマーシブビュー機能」によるルート案内がロールアウトされていたようです。 この3D表示アイコンを押してみると、行き先までのルートが3Dで表示されます。さらに、画面下の再生ボタンを押すと、3D動画として行き先までのルートを表示することができます。 地図を読むのが苦手な人は、Googleマップのルート案内を使って常に現在地を確認しながら行き先に辿り着こうとするもの。しかし、自

Instagramのブランディング表現が注目を集めた頃からか、グラデーションを使った表現がWebデザインやUIデザインに取り入れられるケースがとても多くなり、「グラデーションを取り入れたことがある」というデザイナーも多いのではないでしょうか？ 2017 2019年ごろに特に多く見かけたグラデーション表現ですが、最近になってまた新たなグラデーション表現が流行し始めているように感じます。ブルータリズムや90's風デザインと相性の良いグリッチを加えたグラデーションやテクスチャ感のあ

おすすめのUIデザイン参考サイト10選 アプリのデザインをする際に、他サービスの設計を参考にしたり、競合アプリを調査したりといった作業は多くのデザイナーが日々行なっている作業だと思います。多くの場合は自身のデバイスにアプリをインストールして確認するものの、サブスクリプションや商品の購入など、実際に課金しないと確認できない画面があったり、スクリーンショットを撮って共有したいけど個人用のアカウント名が表示されてしまったりなど、意外と面倒なこの作業... 今回はこのような悩みを解決

この記事では、商用利用可能な無料で使えるアイコン素材配布サイトをご紹介します。その中でも以下のような条件で選定しています。 UIデザインに必要なアイコンが網羅されている モダンで視認性が高いデザイン アイコンのデザインが統一されている Figmaで利用しやすい（Figmaプラグインやコミュニティファイルが提供されている） アイコン素材の入手方法として、ローカル環境にダウンロードできるだけでなく、SVGのコードとしてコピーできるサイトや、CDNで読み込んで使えるサイトなど幅広い