これらのスキルが全てパーフェクトに備わっていなければならない訳ではありません。人それぞれバラつきがあって当然です。 あくまでもデザイナーとしての成長過程で、自己理解をしながら取り組むべき課題を可視化して成長してもらうことが目的となります。 フィードバックの方法 個別のスキルの説明に入る前に、フィードバックの方法がかなり重要なので、触れたいと思います。 9分類の中から “ 良いところ ” と “ 期待したいところ ” （指摘や注意など）を必ずセットで2〜3つづつをフィードバックします。どちらか一方のフィードバックでは、最悪なコミュニケーションになってしまうことは、想像できると思います。ここでは、個人のスキルをポジショニングして、可視化することが重要です。 例えば… 絵作りや装飾を作り込むことが得意なデザイナーが、バナーのような限られた空間でのデザインがうまく行かず苦戦するケースがあります。本

公園ってエッジデザインひとつで、こんなにも魅力的に！台北「永康公園」と大阪「靭公園」に見た、公園と街をつなげるデザインの可能性． 暑さも過ぎ去ってしまえば、寂しいもの。ってことで、今日は台北のフワフワかき氷＆ぷりぷりのマンゴの写真で、少し暑さを思い起こしながら、前回の続きで、台北と大阪で発見した良い公園のお話を。 まずは台北から。この日の台北は、滞在していた東門から徒歩数分の「永康街」エリアを歩いていました。「永康街」は、台湾レポートの最初の記事で取りあげたエリアです。 幸福度アジアナンバーワンを支える豊かなグランドレベル！ 台北「永康街」を歩く編 このエリアの中心には、「永康公園」という三角形の小さな公園があります。生い茂る緑があまりに魅力的なので、思わず入ってしまいます。「いきいきと生い茂る緑」、これは公園づくりの基本中の基本ですよね。 入って直ぐのところにある掲示板に目をやると、ポス

2016年7月27日 UI Crunch #9 UIデザイナーに求められるビジネス力とは 株式会社ペロリ / クリエイティブ部 部長 有川鴻哉

by Jeremy Thomas Let's say you have a product, a portfolio, or just an idea you want to share with everyone on your own website. Before you publish it on the internet, you want to make it look attractive, professional, or at least decent to look at. What is the first thing you need to work on? Content The purpose of design is to enhance the presentation of the content it's applied to. It might sou

ワイヤーフレームづくりに便利なキット40「40 Free Wireframe Templates for Mobile App, Web and UX Design」 本制作をする前にワイヤーフレームで制作して、UIやUXなどをクライアントと確認するというのはWEB業界では慣習的になっていますが、今回紹介するのは、そんなワイヤーフレームづくりに便利なキットを集めたエントリー「40 Free Wireframe Templates for Mobile App, Web and UX Design」です。 Carbon Material Design eCommerce Wireframe Kit (PSD & Sketch) WEBからiOS、AppleWatchまで様々なタイプのワイヤーフレームが紹介されています。今日はその中から特に気になったワイヤーフレームをピックアップして紹介したい

By Wicker Paradise アイコンに関するニュースから販売まで手がけるサービス「Icons8」の中の人が、ウェブサイトのデザインを大幅に変更したところ47％ものユーザーを失ったことをブログで明らかにしました。ブログではユーザーを失うまでの経緯や、なぜ失ってしまったのかの分析結果まで書かれていて、興味深い内容になっています。 How We Lost 47% of Our Users After a Redesign | Icons8 https://icons8.com/articles/how-we-lost-47-of-our-users-after-a-redesign/ サービス開始当初、Icons8はアイコンの開発・販売を手がけるサービスでしたが、毎日新しいアイコンを作り続けるのには無理があるため、「リクエストアイコン」という機能を実装しました。リクエストアイコンとは、

Webサイトの記念的なエントリーやページを作成する際には縦向けのタイムラインがよく使われます。Webページは縦にスクロールされるものが多いので、一番上が過去とすれば、スクロールするごとに経過時間をたどれるようになります。 そんなサイトを作る際に使えるのがBlueprint: Vertical Timelineです。センスの良いタイムラインページが作成できることでしょう。 Blueprint: Vertical Timelineの使い方 Blueprint: Vertical Timelineのデモです。日時とコンテンツ、アイコンが並んで表示されています。 レスポンシブ対応です。 スマートフォンサイズにしても見やすいです。 Blueprint: Vertical Timelineはシンプルなデザインですが、それだけに見やすいのではないでしょうか。この手のコンテンツはよく使われますが、イチから

デザイナーはコードを書くよりも、プロジェクトマネジメントを学べ。一週間ほどシゴトから離れて旅をしてました。とある写真家の方と出会ってすごい刺激されて、シゴトを忘れかけていたのですが、むしろシゴトについて深く考察した一週間でもありました。どうしても書いておかないと忘れると思ったので長いけど書きます。 前提僕の持論というか考察なのであしからず。それと、ここで書いている「デザイナー」とはUIデザイナーにとどまらない広いデザイナーとして見てもらえればと思います。また、デザイナーがやるべき設計であったりビジュアルデザインの一定水準のスキルは持ち合わせているという前提で話を進めたいと思います。 デザイナーのプロジェクトマネジメントここ何年か僕自身のテーマでもあったのですが、いよいよデザイナーはプロジェクトマネジメントができないと厳しい時代になってきたと思います。なぜならデザイナーのシゴトがどんどん複雑

現役プロが比較 ｢WEBデザインスクール12校｣おすすめランキング！ WEBデザインスクール選びで絶対失敗したくない！プロの目線でおすすめを教えて！ WEBデザイナーがデザインする際に使うツールはPhotoshopがベスト？ 最近ではSketchやIllustratorでWEBデザインをされる方も増えているが（Fireworksの人口は減る一方）、Photoshopでデザインされている方がまだ大半を占めている。 以前Webクリエイターボックスさんが実施したアンケートでもこのような結果だった。 やっぱりまだまだPhotoshop強し！みなさん、ご協力ありがとうございました！ぐっない? pic.twitter.com/ajGy0wb46g — Webクリエイター ボックス (@webcreatorbox) 2016年2月19日 さらにPhotoshopは古くなっているわけではなく、Photos

クラブのフライヤーやテクノロジー系のイベント広告などに使われている未来的なフォントは、グラフィックとしても優れ、インパクトを出したいときに使われます。 今回は、そんなシーンにおすすめの近未来・SF風フリーフォントをご紹介します。 TESLA 様々な図形や線が幾重にも重なって文字を形作っているフォントです。フォント自体がグラフィカルなので、画像やグラフィックを入れなくてもとてもスタイリッシュになりそうです。 商用利用可能。 STAR Jedi スターウォーズのロゴのようなフォントです。“@”と入力すれば、スターウォーズのロゴそのままの文字が出てくるというすぐれもの。 商用利用可能。 Anders シャープなラインがとてもきれいなフォント。近未来テイストにも合いますが、それ以外の場面でも使いやすいです。 商用利用可能。 Cyclo 名前の通り、丸いフォームが可愛らしいフォントです。 商用利用可

最近、デザイナーに求められるスキルが多くて何を学べば良いかわからなくなってきた。と言う声を聞くようになってきた。 流行りの記事にいくつか目を通すと、デザイナーは「 経営者と対等に話せるコミュニケーション能力、ビジネスセンスを保有していて、イケてるグラフィックを作り、コードまでかけないといけない 」らしい。 スキルを多く保有している方が望ましいのは間違いない。 ただ、 現場デザイナー に最も大事なのは実装面での考慮事項が網羅されて考え込まれた「 決定力のあるデザイン 」を作る力だと思う。 サッカーで言うと、決定力は「 得点を決める能力 」として使われているけど、UIデザインにおいては「 実装面まで考慮された実装可能なデザインであるか 」という言葉として使っている。 魅せるデザインとフィージビリティが考慮されているデザインでは、かなり内容が異なってくるので、現場デザイナーとしては特にこのあたり

株式会社つみき UI/UX事業終了のお知らせ 拝啓　時下ますますご清祥のこととお喜び申し上げます。 平素より格別のご高配を賜り、厚く御礼申し上げます。 この度、弊社は創業以来続けて参りましたUI/UX事業（受託制作事業）につきまして、2024年4月30日をもって終了することを決定いたしました。 今後は、弊社の主力事業であるFilmarksをはじめとした、映像関連事業に注力して参ります。 ご愛顧を受け賜りました皆様には、深く感謝申し上げますとともに、ご理解賜りますようお願い申し上げます。 敬具 株式会社つみき 代表取締役社長 鈴木 貴幸 事業終了予定日：2024年4月30日 biz@tsumikiinc.com

Nick Babichさんによる寄稿記事です。ソフトウェアエンジニア、テクノロジーの熱狂的な支持者。UI/UXに夢中。ソフトウェア開発、マネージメント、生産性などなどについて執筆している。Twitter アカウントは、@101babich。本記事は、Mediumへの投稿記事を許可を得て翻訳したものです。元の英語記事もどうぞ。 私たちが日々の生活の中で体験するマイクロインタラクションの例 最高のプロダクトは、2つのことで秀でている：機能とディティール（細部）だ。機能によって人はプロダクトに魅力を感じ、ディティールによって、それを使い続ける。このディティールこそ、特定のアプリが競合から抜きん出る理由だと言える。 マイクロインタラクションは、ユーザーに対して快適なフィードバックを返すために有効なテクニックのひとつだ。 あらゆる道は、人間中心設計のデザインアプローチへと続いている。そこで最優先され

中３女子です。 今度友人に InDesign で組版を教える機会ができたので、資料作成ついでにブログ記事に書くことにしました。同人ラノベの組版を InDesign で行ってゆくチュートリアルです。 版面の設計 まず版面（はんづら）を決めましょう。版面とは本文のレイアウトのことです。 即売会で小説同人誌を買うとさまざまな本文デザインの同人誌があります。独創的なデザインで作品の世界観を引き立てているものもあれば、中には読みづらくて読書意欲を損ねるようなものも少なくありません。 読書意欲を損ねるような版面とは、たとえば ・フォントがやたらでかい、もしくは細かすぎ ・行間をとりすぎてスカスカ、もしくは詰まりすぎ などがあります。 単純なことですが、これが上手くできているかどうかで文章のクォリティまで違って見えてきます。一番無難なのは、手元にある商業レーベルのラノベを実際に定規で測って参考にすること

グラフィックデザインの仕事や転職のこと、勤め人だった頃からフリーになった現在のこと、ブログのことなどを綴っています。 menu グラフィックデザインの現場では 「 ３案出して 」と、何かを提案するときにはしょっちゅう言われます。 だから、３案出すのにあまり困らないようなアイデアの出し方をお伝えしたいと思います。 例えば、書籍の表紙、「３案出して」と言われることが多い物件（？）です。 「なぜ３案なの？」という疑問があるかと思いますが、これは今回はさておき、 ３案を出すためのアプローチを、いくつか紹介します。 お客さまの方で、ある程度「こうして欲しい」というアイデアのラフスケッチなどをくれる場合もあります。 それはその通り、ひねらず、素直に、でも、造形的な完成度は高く、作るようにしましょう。 「もう一案はおまかせ」「あと２案はおまかせ」ということも多いです。 ３案出すためのアプローチを知ってい

グラフィックデザインの仕事で、デザイン案の出し方として、バリエーションをもっと出していくにはどうしましょうか、というお話です。 このブログの以前の記事で、3案出すための方法をお話ししました。 ＞＞＞デザイン3案、アイデアを出すための方法 この記事で、まずオススメなアイデア出しの方法として、 ・写真を使った案 ・イラストを使った案 ・平面構成を使った案 の３つを出すと、「違い」を見せやすい、とお話ししました。 それで、この３案を出したとします。 ところが、現場ではありがちなことですが、お客さまは「写真で３案見たい。」などと言い出します。 また、そうでなくても、最初から「写真がいい」というような条件があることもあります。 そこで、今回は、さらにバリエーションを出していく方法についてお話ししたいと思います。 厳密に言うと、「提案」と「バリエーション」は少し違います。 A案 B案 C案 という複数

『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年３月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材／配色やWeb制作といった最新トレンドも公開中。

どうやら生まれてから死ぬまで、私たちの記憶は変化し続けているようだ。実際には、神経細胞の変化によって記憶が形成されているという次第も徐々に解明されつつある※1。 他方で、そうした私たちの記憶に影響を与える環境も大きく変化している。目下、人類はかつてない規模と速度で、各種のデータを生成・蓄積し、通信・交換している。こうした激流、あるいは大渦のようなと形容したくなるような環境下で、自分の記憶のあり方について、その世話をするにはどうしたらよいか。そんな関心から、ここのところ記憶のための新たな知識環境について考えている。以下では、そのスケッチをお示ししたい。 エドガー・アラン・ポーの小説「メエルシュトレエムに呑まれて（A Descent into the Maelström）」に掲載されたハリー・クラークによる挿絵 記憶の条件 記憶については、いくつかの分類が提案されてきた。例えば、記憶が維持され

『フォトショップ・ブイアイピー』の新着記事です。フォトショップやデザインをたのしむウェブサイト。2009年３月創刊以来、3800を超えるコンテンツを更新しています。フリーフォントなどの無料デザイン素材／配色やWeb制作といった最新トレンドも公開中。

ページのレイアウトをする時に全てが同じ大きさ・形・色だと、それは非常に退屈なデザインになってしまいます。要素を整理し、階層をつくり、重要な箇所にフォーカスがあたるようにするにはコントラストを効果的に使うことです。 レイアウトにビジュアルの興味を加え、デザインを生き生きとさせるコントラストの使い方を紹介します。 色の値(value)とはカラーの明るさや暗さをあらわす用語で、ピュアブラックとピュアホワイトに最もコントラストがあります。だからといって高いコントラストのデザインをつくるために、白黒のカラーパレットにこだわる必要はありません。簡単な方法の一つは、そのカラーからより明るいカラーと暗いカラーをつくり、コントラストを加え、あなたのデザインの特定の場所を目立たせることができます。 シンプルな例として、下記のような暗い背景に明るいテキストは効果的にコントラストをつくっています。背景が写真で、テ