最新記事

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

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

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

検索画面の様子が変わる驚きの隠しコマンド コマンド名 内容askew 検索結果が斜めになる do a barrel roll 画面が360度回転する blink html , blink tag 検索結果に表示されているhtmlやtagの文字列が点滅する Festivus 画面端にアルミのポールが表示される recursion 「もしかして」が無限ループする はじめに、検索画面の様子がガラッと変わる、驚きのコマンドを5つご紹介します。 ### askew（斜め） 「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デザインに取り入れられるケースがとても多くなり、「グラデーションを取り入れたことがある」というデザイナーも多いのではないでしょうか？ 20172019年ごろに特に多く見かけたグラデーション表現ですが、最近になってまた新たなグラデーション表現が流行し始めているように感じます。ブルータリズムや90's風デザインと相性の良いグリッチを加えたグラデーションやテクスチャ感のある

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

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

各SNSの画像サイズ この記事では、8つの主要SNSの画像サイズについて、プロフィールページに使用する画像と投稿時に使用する画像のサイズをサービスごとに一枚の画像にまとめています。適切なサイズで画像を投稿することは、ブランドのメッセージを意図した形でオーディエンスに届けるために重要なポイントとなります。ぜひこの記事の内容を参考にSNSへの投稿画像を作成してみてください。 ## Xの画像サイズ X（旧Twitter）では、以下の画像設置ケースについてまとめています。 プロフィー

画像軽量化ツールを一覧で紹介 この記事では、画像ファイルの圧縮ツールをご紹介します。 下記のサイトは、すべてブラウザから手軽に使用できるサイトです。また、JPEGやPNGだけでなく、Web用の高圧縮フォーマットであるWebPや、汎用性の高いベクターデータフォーマットであるSVGなどに対応しているツールもあります。いずれも無料で使えるツールを厳選していますので、気になるサイトがあればチェックしてみてください。 ツール名 JPEG PNG WebP GIF SVG BMP AVI

PdM（プロダクトマネージャー）とは？ PdM（プロダクトマネージャー）とは、製品やサービスの企画・開発から市場投入に至る全体の管理を担う責任者の役割です。製品戦略の策定から設計、開発、販売戦略の立案に至るまで、製品の成功を司る中心人物として活躍します。 市場のニーズを把握し、それに応える製品を創出するため、技術的な知識はもちろん、顧客理解やマーケティング、プロジェクト管理能力など多岐にわたるスキルが求められます。また、チーム内外のステークホルダーとの調整役も担い、業務を円滑

フォントを扱うデザイナーなら一度は使用したことがあるHelvetica（ヘルベチカ）。実は時代に合わせて進化していることを知っていますか？この記事では、”現代におけるHelvetica”をテーマに、その魅力を使用事例などを紹介しながら考察します。Helveticaについてアップデートしましょう！ ## 書体としてのHelveticaは3つあり、デジタル環境でより最適なのはHelvetica Now Helveticaは最初のリリースから何度かデザインが更新され、時代に合わせて

ロイヤリティフリーとは？ ロイヤリティフリーとは、著作権や商標権などが存在する知的財産を利用する際、権利所有者へ支払う使用料を意味する「ロイヤリティ（Royalty）」が無料（フリー）であることを指した言葉です。カナ表記だと同じ言葉に「ロイヤリティ（Loyalty）」がありますが、こちらは顧客や従業員の忠誠心や帰属意識を指す言葉ですので意味が異なります。 ロイヤリティフリーの素材や作品は、素材や作品を使用するたびに料金が発生しないという特徴があります。しかし、一定の条件下では

ゲインロス効果とは？ ゲインロス効果とは、相手に対して初めにネガティブな印象を与えた上で、後からポジティブな印象を与えると、最終的な評価が強くポジティブなものになりやすいという現象です。1965年に、エリオット・アロンソンとダーウィン・リンダーが発見しました。 具体的には、怖く見える人と話してみたら、実は優しい人だったことが分かって、好感度がぐっと高まることなどが挙げられます。いわゆる「ギャップ萌え」のようなものと紹介されることが多いです。 ただし、もともとゲインロス効果は、

バリュープロポジションとは？ バリュープロポジションとは、企業が顧客に提供する価値のことです。顧客がなぜその製品やサービスを選ぶのか、その理由を明確にする独自の要素とも言えます。市場において競合他社との差別化を図る際、バリュープロポジションは重要な役割を果たします。 バリュープロポジションは、さまざまなフレームワークを活用して分析します。たとえば3C分析（顧客、競合、自社の能力）をもちいることで、市場のニーズや競合の動向を把握し、自社の強みを活かした価値提供が考えられます。S

WebデザインやUIデザインに携わっていると、Myriad（ミリアド）という書体を耳にしたことがある人は多いのではないでしょうか？歴史のある書体と比べるとまだ新しいフォントではありますが、その人気の秘密を制作された意図や形の特徴を紹介しながら考察してみます。 ## Appleのコーポレートフォントにも採用されたMyriad、その制作の意図は？ Myriadは、1992年にAdobeのインハウスのタイプファウンダリであるAdobe Originalsから初めてリリースされました

ユーザーシナリオとは？ ユーザーシナリオとは、特定のペルソナが製品やサービスを利用する際の「行動・思考・ニーズ・課題」を、ユーザー視点で段階ごとに分析描写する手法です。 主にUXの設計や改善を目的として使われる手法であり、この手法を用いることでデザイナーやマーケターはユーザーの視点を深く理解し、製品やサービスの改善点を見つけ出せるようになります。そのため、ユーザーシナリオを作成することは、ユーザー中心のデザインを実現するための基礎にもなるのです。 ユーザーシナリオは、ユーザー

デザインを学んだ人なら聞いたことがある「バウハウス」。その正体を実はあまりよく知らない、という人もいるのではないでしょうか？実はバウハウスは、現代の私たちのデザインにとても影響を与えているんです。この記事では、バウハウスとは何なのか、そしてバウハウスのどのような取り組みが現代のデザインに通じているのかを紹介します。 ## バウハウスによって工業化と芸術の統合を目指すモダニズムは始まった バウハウスについて知る前に、当時の時代背景にあった「モダニズム」について整理します。モダニ