タグ

2014年6月2日のブックマーク (2件)

  • 【パス初心者向け】トレースするときに気をつけていること - デザイナーのイラストノート

    SVGの普及かアイコンブームか、パスを使ってイラストを描く方が増えた気がします。前から書いてみたかった、パスでトレースするときに気をつけるといい「作り方」と「考え方」を記事にしてみました。 文字をトレースしてみよう パストレースの練習として、文字やロゴマークをトレースすると言うのはよく聞きます。曲線あり直線有り中抜きあり、で練習にはいい素材です。特にフォントの場合はアウトラインをとることで、どこにアンカーポイントを置けばいいのか参考にすることが出来ます。 試しにこの2つのお題に取り組んでみました。この形を実現するのにどんな方法をとりますか?正解はいくつもありますが、例えばこの方法。 完成!いいじゃない!と思いますか?確かに形としては完璧なんですが、練習であれば個人的にはこちらをおすすめしたいです。 さっきとの違いが分かるでしょうか?3つの図形を組み合わせて文字の形を作っています。文字を書く

    【パス初心者向け】トレースするときに気をつけていること - デザイナーのイラストノート
  • プロっぽくなった!こっそり使いたい「動きのある」CSSテクニック

    作成:2014/06/2 更新:2014/11/01 Web制作 > WebデザインギャラリーやWPテーマなどで「見栄えのする」サイトが使っている効果など。今回はCSSのみで実現できる、動きあるエフェクトをメモしておきます。 エンジニア速報は Twitter の@commteで配信しています。 もくじ マスク 1.マスク・キャプション 2.円形キャプション 3.全画面+オーバーレイ 4.ストライプの背景 フルスクリーン系 5.スライド+フルスクリーン 6.全画面背景動画 7.パララックス 8.フルスクリーンにフィット 9.背景画像をブラウザごとに最適化 10.メガメニュー 画像可変 11.画像で枠線を表現する 12.半透明+フィルタ 13.文字以外を透明にしてレイヤーさせる 図形 14.ループ+ローディング 15.3Dボックス 16.矢印ナビ 画像切り抜き 17.六角形 18.卵型+星形

    プロっぽくなった!こっそり使いたい「動きのある」CSSテクニック