未経験でも1カ月で即戦力クラスの知識が身に付く『webデザインドリル』公開 | knowledge / baigie
「即戦力レベルのwebデザイナーが最低限持っている知識を1カ月で身に付ける」ということを目的としたドリルを作りましたので、皆様に公開します。 ダウンロード[PDF/PSD/XD]（92MB） 本ドリルは、約140ページの参考書兼問題集になっています。まずは出題される問題を解き、その上で解説を読んで理解し、再度問題を解きなおすのが基本的な流れです。 内容は、私たちが未経験デザイナーの採用を進める中で、「こういう知識は早い段階で身に付けておいてほしいよね」という知識をまとめました。また演習用のPSD/XDファイルもドリルに含まれています。 身に付くのはあくまで「即戦力クラスの知識」であって、「即戦力」になれるわけではありません。デザインには、非言語・非定型なスキル領域も多々あるため、座学だけで即戦力にはなりません。しかしそれでも、ベースとなる知識は絶対に必要ですし、それを指南する参考書は、的を
Googleの新ツールが便利すぎる！デザイナーやディレクター向けの新しいデザインツール -ProjectVisBug | コリス
VisBugはChromeの機能拡張で、ブラウザに表示したページのデザインやコンテンツを検証・編集できます。グリッドの確認はもちろん、要素を移動させたり、入れ替えたり、別の画像にしたり、テキストを編集したり、カラーを変更したりなど、さまざまなアイデアを実行・テストすることができます。 制作や検証時だけでなく、クライアントとの打ち合わせ、社内ミーティングなど、活躍するシーンがたくさんある便利ツールです。 VisBug -GitHub VisBugの特徴 VisBugのインストール VisBugの機能 VisBugの特徴 VisBugはChromeの機能拡張で、デベロッパーツールのデザイナーやディレクター向けという感じです。開発者のAdam Argyle氏は、Googleの現役UXエンジニア。 機能拡張なので、使うのは簡単です。 Chromeで当ブログを表示し、VisBugを起動してみました。
数千ページのワイヤーフレームを書いてきたWebディレクターがUI設計時に気を付けている８つのこと。 - 笑顔を創りたいWebディレクターの日常
なんかすごい思い付きで www.adventar.org に参加してみたんですけども。 気づいたらいつの間にか自分の日になっていて面倒くさくなってきて激しく後悔したびっくりしたという。 ぼくはWebディレクターでありデザイナーさんではないし、すてきデザインができるようなビジュアルセンスのようなものは、誠に残念ながら母上から授けられずにこの世に生を受けているものですから、"いわゆる"デザインはやらないんですが、その前の画面設計についてはワイヤーフレームなるものでいっつもやっておりますので、その観点からなんか書きましょうとそういうことですお母様（謎） そんなわけで、うぇぶぎょうかいのむめいでぃれくたーのお時間です。 Webディレクターとしてはえーと、もうすぐ丸１２年になります。そうするとまあ、たぶん数千ページは「ワイヤーフレーム」をつくってきたんじゃないかと思います。正確な数字はわかんないです
最近のWeb制作の勉強になる！Webサイトのワイヤーフレームやプロトタイプのまとめ
プロジェクトのメンバーでないとなかなか目にすることができないワイヤーフレームやプロトタイプ、他の人がどのように作っているか気になります。 最近のWebサイトやスマホアプリの制作で参考になりそうなワイヤーフレーム、フローチャート、プロトタイプを紹介します。 UXデザインのツールも、Adobe XDが先日ベータ版としてリリースされ、SketchもメジャーアップデートとなるSketch4がリリースされ、充実してきましたね。 Adobe XD Wireframe Kit for UX Designer for Adobe XD まずは年内にWindows版のリリースが予定されているAdobe XDで作成されたワイヤーフレーム用のキット。最近のWebサイトで使用されているコンポーネントが数多く収録されています。
デザインで色を美しく重ねる、6つの簡単テクニックまとめ
色はどんなデザインにおいても重要な要素です。鮮やかな色合いでも、ミニマルなモノクロデザインでも色の使い方によって、デザイン全体を魅力的に仕上げることができます。 色を使って印象づける方法のひとつとして、デザインに色を重ねるテクニックがあります。具体的には、イメージ写真や動画ビデオに半透明で色の付いたレイヤーを重ねることを指します。このエフェクトによって画像にメッセージを含むことができ、デザインに注目を集めることができます。 今回はウェブサイト制作の参考にしたい、さまざまな色の重ね方について見ていきましょう。 グラデーションを試してみよう。 グラデーションは魅力的なデザインとして再認識されており、カラーオーバーレイとして利用することで、うまく人目を惹くことができます。 特にグラデーションが素敵な理由としては、複数の色を自由に組み合わせできる点です。ここで利用する色にはブランドコンセプトを検討
色覚異常の人からはこう見える。同じ写真の見え方を比べた比較写真
色を判別する錐体細胞が欠損している色覚異常の人からは世界がどう見えているのかを、同じ写真を使って比べた比較写真。 錐体細胞のうち1つが欠損している2色型色覚の場合を比較したもの。 個人差があるから一概にこの写真のとおりに見えるとは言えないけれど、人によって世界がこんなに違って見える事に驚いてしまう。 【関連】 色付く世界に思わず感涙。色盲の兄弟がEnChroma社の色覚補完メガネで、初めて色を見た瞬間 色覚異常を補完するEnChroma社のメガネにより、初めて色鮮やかな世界を目にした人々の反応 なんて素晴らしい発明なんだ！色盲の人が色鮮やかな世界を見ることができる夢の様なメガネ「Valspar」 淡いグラデーションを正確に並べ替える色彩感覚チェックテスト Test your color IQ 1. 色覚に異常がない人が見た色鉛筆 2. 赤が欠損した2色型第1色覚（protanopia） 3
レスポンシブの確認もできる！UIコンポーネントのデザインや実装方法をまとめて管理できるスタイルガイド -Component Styleguide
Webサイトで実装するさまざまなUIエレメントやコンポーネントのデザインや実装方法をまとめて管理できるスタイルガイドを作成できるシンプルなフレームワークを紹介します。 必要に応じて、HTMLのテンプレート、CSSのスタイルシート、使用しているのであればJavaScriptもすべて利用できます。
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
