おかんでもわかるわかるUXデザイン Version 0.2 CSS Nite Edition - ネコメシCEOブログ
2014年4月26日開催のCSS Nite LP33の再演版で登壇して参りました。僕はLP33に出てませんので、再演版なのに再演ではないという按配。それと、再演でもないのになんで出てんのっていうと、ネットイヤー坂本くんが急きょ登壇中止となったので代わりに出てくれないかという打診がありまして、準備期間が短いけれども、本ブログでもすでに公開済みの「おかんでもわかるUXデザイン」であればいけるだろうと快諾した次第でありました。 先日公開しました「おかんでもわかるUXデザイン Ver.0.1」は、スライドシェアにて15,000viewsを超える参照数を頂いておりまして、正直、CSS Nite来る人とかもう全員見てんだろう、と思っておりました。なのでただでさえ再演じゃないのに、内容もみんな知ってるみたいな前提を思っていて、本当に心折れそうな按配だったのですが……、アンケート的には「ま、いんじゃねえの
”スラスラわかる”未経験からのHTMLとCSS｜オンライン動画授業・講座のSchoo（スクー）
未経験者向けHTMLとCSSの授業です。基礎的なHTMLタグ、レイアウトを調整するためのCSSを使用して、受講生の皆さんと一緒に作業をしながらWebページを組み立てる実習授業です。架空のカフェ「KUJIRA cafe」のサイト2ページ分を作成します。 ページの作成に使用する写真などは用意しているので、あとはHTMLとCSSを書いてみるだけ。書いて作って、結果を確認したら、「なるほどこういうものなのか」と、おおよそのことは理解できるようになるでしょう。 「はじめてみたいけどなにから手を付けたらよいかわからない」という方は、是非参加してみてください。 この授業の実習内容 HTML ・すべてのページで使われるHTMLを記述する ・見出し、段落、リストを記述する ・リンクを張る ・画像を挿入する CSS ・背景色、文字色を指定する ・背景に画像を指定する ・レイアウトを調整する など ※実習ではこ
WEBデザイナーのためのエディタ入門｜オンライン動画授業・講座のSchoo（スクー）
コンピュータの言語である「コード」を記述するためには「エディタ」が必要です。 WebデザイナーもHTML＆CSSをはじめとした言語を書いていきます。 Webデザイナーにとって、コーディングそのものが「仕事」ですが、「学び」でもあります。 新しい技術・表現の模索はコーディングから始まることも多いのです。 そして、コードを書く「道具」がエディタということになります。 よい道具の条件は使いやすい機能あることと、育てられること。 お気に入りのエディタは、自分の相棒のようなものです。 この授業では、HTML＆CSSのコーディングを通して、 OS標準のエディタから、Adobe Dreamweaver、Sublime Text2の使い方を学びます。 また、実践的なカスタマイズ方法をご紹介する予定です。 目標は「会話をするようにコーディング」すること！ いっしょに頑張っていきましょう！
Webデザインの基礎と実習①｜オンライン動画授業・講座のSchoo（スクー）
この授業は実際に手を動かしながら、つまりPhotoshopを起動して、受講者の皆様にも実際に制作をして頂くタイプの授業となります（実習は2週目、3週目のみ）。 Webデザインに興味はあるけどやったことはないという方はもちろん、実際の作業を見ることで、既にWebデザイナーとして活躍されている方も新しい発見があるかもしれません。 授業は全3回で構成します。 1週目はWebデザインの基礎知識についてお話しします。2週目は、WebデザインのためのPhotoshopの環境設定と基本操作、Webボタンの制作となり、3週目は広告バナーの制作方法についてお話しします。 PhotoshopによるWebデザインの基本操作は、バナー制作やWebページのデザインカンプ制作はもちろん、iPhoneアプリのデザインなどさまざまな分野で役に立つと思います。ぜひこの機会に身につけておきましょう！
Webデザインの基礎と実習③｜オンライン動画授業・講座のSchoo（スクー）
この授業は実際に手を動かしながら、つまりPhotoshopを起動して、受講者の皆様にも実際に制作をして頂くタイプの授業となります（実習は2週目、3週目のみ）。 Webデザインに興味はあるけどやったことはないという方はもちろん、実際の作業を見ることで、既にWebデザイナーとして活躍されている方も新しい発見があるかもしれません。 授業は全3回で構成します。 1週目はWebデザインの基礎知識についてお話しします。2週目は、WebデザインのためのPhotoshopの環境設定と基本操作、Webボタンの制作となり、3週目は広告バナーの制作方法についてお話しします。 PhotoshopによるWebデザインの基本操作は、バナー制作やWebページのデザインカンプ制作はもちろん、iPhoneアプリのデザインなどさまざまな分野で役に立つと思います。ぜひこの機会に身につけておきましょう！
レスポンシブWebデザインの基礎と,コーディング実習｜オンライン動画授業・講座のSchoo（スクー）
スマートフォン、タブレットなどのスマートデバイスの爆発的な普及により、Webサイトのマルチデバイス対応が求められてます。そのひとつの手法としてレスポンシブWebデザインが注目されています。 この授業では、レスポンシブWebデザインの概要と、注目されている理由、その基本的な実装方法について話します。また実際にハンズオンで簡単なレスポンシブWebデザインのサイトを制作します。実際に手を動かして制作することでより理解が深まります。 レスポンシブWebデザインは比較的新しい手法であり、またレイアウトが可変で複数のデバイスに対応するため、今までのサイト制作とは大きく考え方や制作のフローを変える必要があります。またデバイスの画面サイズや回線速度などの違いを様々な技術を組み合わせて補う工夫をする必要もあります。 このように学ぶことは多岐に渡りますが、まずは入り口として基本的な部分を学んでレスポンシブWe
WEBデザインにおける、Photoshopの作業速度向上テクニック｜オンライン動画授業・講座のSchoo（スクー）
Webデザインのみならずさまざまなクリエイティブワークで必須のアプリとして不動の地位を確立しているPhotoshopですが、そのあまりにも高機能・多機能な振る舞いに、なんとなく使っているという方も多いのではないでしょうか？ 今回の授業では、作業をより効率化し時間短縮につながるポイントを、実際のワークフローに沿ったかたちで進めていきます。 たとえば、制作をはじめる前の環境設定一つとってみても、掘り下げるべきポイントがあります。 まずは、Webデザインに適した設定を行ってから。そこからが今回の授業のスタートです！ 次にページのフォーマットづくり。ここではいろんなガイド機能を利用します。 そして、実際のデザインワークではブラシやマスクの活用、グラフィックパーツの使い回しなど。 デザインが終わればいよいよ画像の書き出しです。こちらもいろんな機能やツールを使った方法を見てみましょう。 また、Phot
表現別、PhotoshopとIllustratorの使い分けを学ぶ｜オンライン動画授業・講座のSchoo（スクー）
授業目的：Photoshop・Illustratorのコンビネーションを学ぶ WebデザインにおけるAdobe Photoshop & Illustratorは、 ビジュアルを作るアプリケーションの定番となっています。 それぞれのアプリケーションには得手不得手があり、 お互いを補うことで効率アップと表現の幅を深めることが可能です。 この授業では、カフェのWebサイトのデザインを題材にして、 Webデザインの制作フローと、アプリケーションのTIPSをご紹介します。 Adobeのアプリケーションは最初のハードルが高い印象があるようですが、 「この表現のためにどんな機能が必要か」という視点で授業を進めてまいります。 これからアプリケーションに触れる方にとっても、 Photoshop & Illustratorの魅力が伝わればと思います。
mono-stock » Illustrator関連
ストックマガジンをご活用下さい。 『サイトを毎回チェックしている暇がない』『RSS購読が煩わしい』そんな方には【ストックマガジン】がオススメです。投稿があった時だけ、1週間に1回のペースで自動的にデザインのネタをあなたのメールへお届けします。メールチェックのついでに使えそうなネタのみを見つけて参考にすることができます。是非登録しご活用下さい。 登録はメールアドレスを下に入力して送信すれば登録完了！ ≫登録はコチラから フリーで使える写真素材・デザインの使える情報サイトの紹介 「デザイナーになりたい」そんなデザイナーの卵におくる個人作品の支援サイト、デザインの一般論や多彩なツール・基礎知識などプロになるためにしっかり身につけておきたい情報がたくさん！他にも色合わせチャートや便利なソフトショートカット表・Macの基礎講座を詰め込んだPDFのダウンロードなどが可能です！
mono-stock｜モノストック｜フリーで使える写真素材・DTP・WEBデザインの使えるネタ帳・WORDPRESSのネタ帳
Wordpressのカスタマイズが柔軟に行えるテーマの代表とも言えるLightningを新規でインストールすると、ウィジェット機能のというウィジェットが消えてしまう為、そのウィジェットを復活させるコードを紹介します。 function my...
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
