Web制作者は1冊持っておくとかなり便利！UIに適したさまざまなアニメーションの実装方法が分かる解説書 -動くWebデザイン アイディア帳 実践編
Webページに動きやアニメーションを加えたい、毎回検索で探している、実装の手順を解説してほしい、そんな時にすぐに役立つコピペで利用でき実装方法もカスタマイズもていねいで分かりやすい解説書を紹介します。 動きやアニメーションのコードはサポートサイトから最新版がダウンロードでき、要素表示、背景の動き、エリアの動き、画像の動き、テキストの動きなど9種類にバリエーションが100個以上あり、「この1冊が丸ごとカバー」の文字通り大全集です。 既視感を覚えた人は、大正解！ 「動くWebデザインアイディア帳（紹介記事）」の第2弾で、第1弾は基本的な動きでしたが、第2弾の本書は実践編として「印象に関わる動き」となっています。 Web制作者は、1冊持っておくとかなり便利だと思います。こういった気持ちいいアニメーションはクライアントからの要望も多く、喜ばれます。
[こかげ] フォント : Nu みちしるべ
概要 「Nu みちしるべ」は、日本の道路標識に基づいて作ったフォントです。標識の数字に興味を持ったのが切っ掛けで作りましたが、数字だけだとフォントとしてあまり面白くないので、周りの赤い円を含めて自動的に組み立てられるように作り込んでみました。道路標識の全種に対応しているわけではないです。用途は…何かあるでしょうか。 標識を自動的に組み立てるには、アプリケーションが OpenType‐フォントの高度な機能に対応している必要があります。非対応のアプリしか持っていない場合、手動で画像編集をして部品を組み立てる事になりますが、その部品としてフォントを利用できます。 ウエブブラウザーも今のところ対応状況が微妙なので、次の見本は崩れて表示されてしまうかも知れません。「直接編集」や「自動着色」を切り替えてみると表示が改善する場合があるようです。（なお「直接編集」を無効にした場合、文字列の書き替えは左上の
フォント選びに迷ったら見返したい、おすすめ定番フォント31選まとめ (欧文編)｜原田 佳樹 Harada Yoshiki
こんにちは！トライブグループという会社でCDOをやっています、原田佳樹 @yoshigorouu といいます。前回はこんな記事を書きました！ 今回の記事では、デザイナーが抑えておくべき定番欧文フォント31個(+おまけ)をまとめました。世の中で使われている大体のフォントをまとめてあるので、何かデザインするときの辞書的な感じになれば嬉しいです。 1. フォントの世界に魅入ったきっかけ私のデザイナーとしてのキャリアはスタートアップ歴が長いので、スキルセットがサービスデザインに寄っています。客観的に見てもグラフィカル領域(特にサービスロゴ)が弱く、それを強化したい気持ちは前からありました。 世の中にある様々なサービスロゴを見ていくと、大体のロゴはシンボル＋タイポグラフィで構成されています。なので、フォントについて多少なりとも詳しくなれば、ロゴ制作の半分は出来るのではと思うようになりました。 リサー
2018年はこれで決まり！Webデザインの最新トレンドまとめ | web design trends
Webデザインは1年単位で流行が変わるため、常に最新のトレンドにキャッチアップし続けなければなりません。デザインの流行は技術やデバイスの進化や環境の変化が影響することも多く、ユーザビリティやUI/UXの観点からも最新のデザインを取り入れることはとても大切なことです。 今回は、2018年に流行するであろうWebデザインについて参考になるサイトと合わせてご紹介していきたいと思います。 2019年のWebデザイントレンドに関する記事を公開しました。最新情報を知りたい方はこちらをご覧ください。 2019年に流行するWebデザインの最新トレンド18個まとめ そろそろ2018年も終わりを迎え、2019年がやって来ようとしています。この1年でWebデザインのトレンドにも様々な変化がありましたが、2019年はどのようなWebデザインの手法が流行するのでしょうか... Web Design Trends 1
デザイナーと働くなら知っておきたい4タイプのデザイナー像 | ベイジの社長ブログ
世間一般ではデザイナーは一括りに語られがちですが、デザイナーも千差万別、一人一人に個性があり、異なる価値観を持っています。この多種多様なデザイナーを一種類にまとめて扱うことは、デザイナーとのミスマッチに繋がり、デザイナーを擁する組織のマネジメントにとって、深刻な問題を引き起こすこともあります。 自分自身は経営者兼デザイナーとして仕事をし、今まで多くのデザイナーを見てきました。その私の経験則でいえば、デザイナーは大きく4つのタイプに分類できると考えています。例えば採用面接などで新たにデザイナーと出会った際には、まずはこの4タイプを手がかりにして、その方の理解を深めていったりします。 私が考えるデザイナーの4つのタイプとは、縦軸に「挑戦的」「保守的」、横軸に「感覚的」「論理的」を置いた4象限で表現できます。以下がその図です。 ここからは、理想実現型、成果追求型、共同作業型、実務遂行型の順に、そ
デザイナーの父親が子供の手書き文字でフォントを作った理由と顛末
後ろ姿で失礼します、タムカイです。 あ、すみません、今ちょっと仕事中でして… え？お仕事ですか？ ああ、はい、デザイナーってのをやらせていただいております。 え？デザイナーの仕事といえば今話題のあの…？ いやいやいや、違います違いますよ…！！ まあ、あの問題については個人的にkmんが塩津gはr；いskん（ry と、ここ最近よく聞く業界のゴタゴタした感じはさておき、わたくし仕事やら何やらの都合で帰宅するのが遅くなってしまうことがよくあります。 そうすると、日中はあんなに騒ぎまくりまとわりつきまくりの子供たちもすっかり寝てしまっていることがほとんど。 子供を起こさないようにそーっと玄関の扉を開けて、ゆっくりリビングへ向かう動作にも随分慣れてまいりました。 一方、パパ産業も七年目に入ってくると子供たちとのコミュニケーションの幅はとどまることなく広がっていきます。 しゃべり言葉で語彙が増えていくの
有名企業・ブランドのロゴで採用されているフォント15選
企業のロゴをデザインする際に重要となる要素の一つが「フォント」です。 どのフォントを使うかによってイメージが大きく異なりますので、目的としている企業のコンセプト、イメージしているものに近いものを選ぶ必要があります。 そんなロゴデザインでぜひとも参考にしたいのが有名企業、ブランドが採用しているフォントです。 誰もが知る大手企業でも意外に定番のフォントを使っていたり、既存のフォントをベースにユニークなアレンジを加えている企業があったりと、デザインのヒントが隠れています。 今回は、有名企業・ブランドが採用しているロゴフォントをまとめてご紹介します。 ▼ディレクターとデザイナーで読みたい資料 マーケ思考のデザイナーは強い！ 提案型デザイナーのススメ リード獲得が重視される「広告・LP・サービスサイト」などに携わるデザイナーの皆様に向けての資料です。成果を出すデザインにするために心がけたいポイントを
デザイナーはなぜMS Pゴシックを使わないのか? - エディトリアルデザイナーに聞いてみた
デザインを語る上で重要な要素のひとつ、「フォント」。デザインを実際に手がける人だけでなく、それを見る多くの人にとってなじみ深いフォントとして、Windowsのプリインストールフォント「MS Pゴシック」は代表的なもののひとつかもしれません。 「MS Pゴシック」 「MS Pゴシック」は過去にマイナビニュースで実施した美大生の「お気に入りフォント」アンケートにも名前が挙がった実力派(?)ですが、実際に日々グラフィック/エディトリアルデザインを手がけているデザイナーの目には、この定番フォントはどう映るのでしょうか。 今回は、デザイン会社にてエディトリアルデザイン/Webのレイアウトデザインを手がけているSさんに、「MS Pゴシック」についての率直な思いを伺いました。 ――「MS Pゴシック」、デザイン業務で使うことはありますか? 私は主にエディトリアル(雑誌や書籍など)、グラフィック、Web領
知らない人は損してる、イラレでスーパーのチラシを作るときの7つのワザ - Cherry Pie Weblog
昨年から、地元の印刷会社さんのお手伝いでスーパーのチラシを制作させていただいているんですが、最初に作業手順を聞いたときに、そのあまりの面倒さに閉口してしまいました。 スーパーのチラシって、何重もの文字フチとか、値段の数字が重なってて円だけ小さいとか、囲みとか、必ず文字が画像にかかってしまうから白フチもつけないといけないとか・・・ そんな手数のかかる作業を、長年チラシ制作をされている方は、イラストレーター5.5 でショートカット連打でバキバキ作ってたりするわけです。 しかし、短納期・安価を求められる今の時代、いつまでもイラストレーター5.5時代の作業を続けているのでは、相当な熟練者でないと時間にもお金にも見合う仕事ができないし、会社としては熟練者に単純作業に近いことに延々と時間を使ってほしくないのです。 でも、今のイラストレーターならできるんですよね。 そんな、知っている人は知っているけど、
ArtPose | リアルなのに驚くほどよく動く。好きなポーズでスケッチできる3DCG人体ポーズモデルアプリ
人物を描くのは難しい。だから3DCGの人体モデルは便利ですよね。iPadでも好きなポーズを付けることができるリアルな人体モデルアプリが登場しました。 筋肉の付き方や陰影もじっくり観察して描くことができます。iPhoneでも使えるユニバーサルアプリです。 高画質な3DCGモデルを自由に動かそう このアプリでは画面上の3DCGモデルを好きな角度から好きなポーズで見ることができます。ポーズはあらかじめ12種類登録されているので、そこからカスタマイズしてみるのもいいでしょう。男性モデル版と女性モデル版の2種類がリリースされています。 操作は画面の四隅に配置されているボタンで行います。左下のカメラのアイコンをタップすると視点を自由に移動できるモードになり、右下のアイコンをタップするとポーズを切り替えたり関節を動かせるモードなります。 ポーズはスクリーンショットを撮るか、視点移動モードで右上に表示され
Picky-Pics
Picky-Pics（ピッキーピックス）は誰でもプロ並みのデザインでポスターやチラシ、 プレゼン資料などが作れるオンラインデザインツールです。
約5万点の素材からドラッグするだけで、プロ並みのデザインが仕上がる新サービス “Picky-Pics (ピッキーピックス)”、本日リリースです！
こんにちは、新プロダクト担当の林です。 本日、ブラウザ上でプロ並みのチラシや名刺をデザインする新サービス “Picky-Pics (ピッキーピックス)” をリリースしました。 Picky-Pics を使う 約5万点の素材とドラッグ＆ドロップ Picky-Pics は、約5万点の写真やイラストの素材をドラッグ&ドロップによる簡単な操作で自由にレイアウトし、プロ並みのデザインを作成できるウェブサービスです。名刺、ハガキ、プレゼンテーション、フライヤー等の多彩な用紙を選択して、手持ちの写真や Picky-Pics ライブラリの素材をキャンバスにドラッグ&ドロップすれば、すでに完成したも同然です。 あとは色やテキストを変更したり、お好みのレイアウトパターンを選ぶだけで、プロ並みのデザインに仕上げられます。つくったデザインは PNG・ PDF・ウェブに出力可能で、自動でサーバーに保存されるので、自宅
株式会社 アールエイジ
渋谷区代々木上原/新宿/恵比寿/渋谷 他 千代田区飯田橋/神保町/秋葉原 他 港区・目黒区広尾/泉岳寺/中目黒 他 新宿区神楽坂/四ツ谷/四谷三丁目/江戸川橋 他 中央区築地/勝どき 他 台東区・江東区清澄白河/門前仲町/浅草橋/上野 他 品川区・世田谷区五反田/目黒/三軒茶屋 他 杉並区・中野区高円寺/荻窪 他 その他エリア
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ウェブ初心者も安心して作成できる、無料HTMLテンプレート素材24個まとめ - PhotoshopVIP
新着記事
HTML5とCSS3の実用的なテクニックが丁寧に丁寧に解説されたウェブ制作に真剣に取り組みたい人にオススメの本 -HTML/CSS デザインの教科書
新着記事
2013年のウェブデザインのトレンドを探るかっこいいUIデザインのまとめ
新着記事
【黄金比・計算サイト ★★★】 - Metallic Ratio