Webやアプリのデザイントレンドを紹介。たまに雑談。

Browse By

Tag Archives: Tutrial

[Typography] 20 New Photoshop Text Effects – フォトショップで行うテキストエフェクト

  • Pocket
  • このエントリーをはてなブックマークに追加

フォトショップで行うテキストエフェクトのまとめ。わりと新しいものばかりが紹介されてるようです。タイポグラフィーのネタ帳に使えそうです。リンク先ではチュートリアルが紹介されているので、フォトショップの修行にもナイスな教材だと思います。

[Photoshop] 3D Text Effects: Ultimate Collection of Photoshop Tutorials – フォトショップで作る3Dテキストエフェクトのチュートリアルまとめ

  • Pocket
  • このエントリーをはてなブックマークに追加

フォトショップで作る3Dエフェクトチュートリアルのまとめ記事。かなりの数のテキストエフェクト作例がまとめられてます。立体的な表現の作例だけに、3Dモデリングツールと併用した作例もいくつかあるようです。自分の場合フォトショップで最初にやったのがテキストいじりだったので(バンドのロゴ作ってました)、こういうチュートリアルってフォトショップを学習する上でいい教材だなーとか思います。タイポやグラフィックデザインのネタ帳にもいいですね。

[CSS3] 15 Fresh and Useful CSS3 Tutorials To Boost Your Skills – CSS3のチュートリアルまとめ

  • Pocket
  • このエントリーをはてなブックマークに追加

CSS3を使った様々なテクニックの紹介記事をまとめたもの。15の作例が紹介されてます。印象的なBlockQuote、リフレクション、テーブル装飾、ページングの作例、ボタン、Google+のようなサークルエフェクト、ギャラリーのサムネール装飾、CSSフィルター、グラデーションなど色々あります。こういう記事って一通り読んでおくと、思わぬところで役に立ったりしますね。

[Tutrial] TheCodePlayer – 作例と、そのライブコーディングを見れるサイト

  • Pocket
  • このエントリーをはてなブックマークに追加

CSS3やHTML5を使った作例の紹介と、そのライブコーディングを見る事のできるサイト。作例を選択すると、まずは動作デモを見る事ができます。作例デモ画面内で「Play Walkthrough」を押せばライブコーディングが始まります。また「View Code」では単純にコードだけを見る事もできます。コーディングの時間の進み方は最大20倍速まで上げる事ができ、徐々に形になっていく様子を見る事ができます。これなかなか勉強になりますね。時期的に新人の教育にも使えそうです。

[UI Design] 40 Quality Photoshop UI Design Tutorials – フォトショップで描くUIのチュートリアル

  • Pocket
  • このエントリーをはてなブックマークに追加

フォトショップを使ったUIデザインのチュートリアル。動画や記事で紹介されてます。WebやMobileAppでよく使われるパーツ類や、Webのナビゲーション、動画プレイヤーやガジェット類の作り方などがその内容。作例によってはリンク先でPSD配布してたりするので、デザインのネタ帳にひとつ。

[Graphic Design] 36 Brilliant Photo Effect Tutorials – フォトエフェクトのチュートリアルまとめ

  • Pocket
  • このエントリーをはてなブックマークに追加

写真を素材としたグラフィックデザインのチュートリアルまとめ記事。フォトエフェクトなので主にPhotoshopを使ったチュートリアルとなります。作品の質は作例によりまちまちだけど、中にはスゴいクールな作例もあります。こういうの最近作ってねーなー、なんか作りてーなーとか思いました。

[Graphic Design] 26 Advanced Digital Painting Tutorials To Greatly Elevate Your Art – デジタルペインティング

  • Pocket
  • このエントリーをはてなブックマークに追加

デジタルペインティングに関するチュートリアルをまとめた記事。こういうのあまり専門ではないんだけど、Call Of CthulhuとかA Heroic Maleとか見てたらなかなかアツかったので紹介。紹介されている作例がどれもクオリティが高く、ファンタジーやメカニック系など男の子大喜びの素材が多いので、こういうの描きたい人は勉強になりますね。ツールとしてはIllustratorやPainterなどを使ってるようですが、フィニッシュ作業はPhotoshop使う人が多いのかも。

[CSS3] 50 Useful and Instructive CSS3 Tutorials You Always Wanted To Complete From 2012 – CSS3を使ったチュートリアルまとめ

  • Pocket
  • このエントリーをはてなブックマークに追加

CSS3を使った作例とそのチュートリアル記事をまとめたもの。テキスト&タイポグラフィー、メニューやナビゲーションとスライダー、フォームやイメージギャラリー、Tipsやテクニックといった感じでカテゴリごとに紹介されてます。紹介されてる内容がわりと実用性重視で(CSS3だけで描いたゼ!的な作例も好きなんだけど、実用的ではないよね)、制作現場において有用な内容かと。ダラダラ見てるだけでも「こんな事できるんだー」的な内容がチラホラ見つかってナイスです。