タグ

ブックマーク / www.webcreatorbox.com (5)

  • SVG形式のファビコンを設置しよう

    2022年4月27日 SVG, Webサイト制作 つ・い・に!ファビコンもSVG形式が対応されるようになりました!SVGを使えばこれまで使われてきたPNGなどのビットマップ形式とは違い、拡大縮小しても画質が劣化しません。つまり、過去記事「クリエイティブなファビコンを設置しよう」で紹介したように多くのサイズを用意する必要はありません!やったね!少し工夫すればダークモードにも対応できますよ!さっそくみていきましょう! ↑私が10年以上利用している会計ソフト! SVGファビコン設置方法 1. SVG形式のファビコン用画像を用意 グラフィックツールでファビコンにしたい画像を用意します。サイズは特に気にしなくてもOK。正方形であればどのサイズでもきれいに表示されます。今回はIllustratorを使って32x32pxのものを用意しました。 SVG形式で保存します。 2. HTMLファイルに記述 あと

    SVG形式のファビコンを設置しよう
  • Illustratorで手描き風イラストを描く方法や無料ブラシいろいろ

    2022年4月27日 Illustrator ベクター形式で描かれたイラストは、拡大・縮小しても画像が劣化せず、編集もらくちん。なので多くのイラストはベクター形式を採用しています。Illustratorではベクター形式のイラストを手描き風タッチにすることも可能ですよ。久しぶりにIllustratorでがっつりイラストを描く機会があったので、手描き風イラストの作成方法を紹介します! ↑私が10年以上利用している会計ソフト! ベジエ曲線が苦手?フリーハンドでOK! Illustratorに苦手意識を持っている方もいるでしょう。その多くの方が「Illustratorはペンツールでベジエ曲線を使いこなさなきゃいけない」と思っているからではないでしょうか? ベジエ曲線では、紙にペンで描くようにマウスの軌跡にそって線を引くのではなく、点と点をつないで線を描いていきます。次の点を描画する時にドラッグする

    Illustratorで手描き風イラストを描く方法や無料ブラシいろいろ
    nisisinjuku
    nisisinjuku 2019/11/15
    動画で見えるのは助かる。
  • Adobe XDでアニメーションのあるプロトタイプをデザインしよう

    2022年4月27日 Webデザイン, XD Webサイトのデザインカンプを画像として作成…というのはもう昔の話。最近ではアニメーションの伴ったWebサイトやアプリばかりで、それを画像で説明するのはなかなか困難です。Adobe XDを使えばアニメーションを含めたプロトタイプが作成できますよ! ↑私が10年以上利用している会計ソフト! 作成するもの 今回はAdobe XDを使って、ローディングバーが動き、画面が推移し、スワイプで画像が切り替わる、というアプリのプロトタイプを作ってみようと思います。 Adobe XDの基的な使い方は過去記事を参考にしてみてください: Adobe XDでWebデザインをしよう!画面作成からページ推移までの手順を紹介 Adobe Experience Design(XD)を使ってアプリのプロトタイプを作ってみた ローディングバーの作成 まずはベースとなる画面とロ

    Adobe XDでアニメーションのあるプロトタイプをデザインしよう
    nisisinjuku
    nisisinjuku 2019/02/07
    デザイナーの業域が広がりすぎて不憫。(僕もプランナーなはずがモデリングとかやってるし人のことは言えないw)
  • Webで使えるカラーネームと、そのカラーコード・RGB値一覧

    2019年3月13日 CSS, 色彩 Webサイトを作るとき、通常色の指定にはカラーコードを記述しますが、決められた色名称を使うこともできます。色を自分で一から探すより、リストの中から選ぶ方がイメージにあう色が探しやすいよなぁ…という場面があったり、単純に色の名前からカラーコードやRGB値を知りたいということが時々あったので、一覧にまとめました。新たに加わった「rebeccapurple」も一覧に入れていますよ。 ↑私が10年以上利用している会計ソフト! 追記:カラーコードをRGB値に変換するツール作りました→「Quick HEX to RGB」 覚えやすい・使いやすい色 Webサイトの制作途中やテスト段階では、手軽に「とりあえず」色をつける…ということもあります。そんな時は短くてスペルの簡単な色名称を覚えておくと便利です。よくある「red」や「blue」だと彩度が高すぎて使いにくい、と

    Webで使えるカラーネームと、そのカラーコード・RGB値一覧
    nisisinjuku
    nisisinjuku 2019/01/24
    コリスかな?⇒コリスじゃなかった!!
  • Web業界で活躍する日本人の素敵な名刺デザイン 2018年版

    2018年8月27日 インスピレーション, 名刺 今年はYATのblogのYAT氏と一緒に「デザインシンキングセミナー」を各地で行っています。そこで多くの方とお話する機会があり、たくさんの名刺をたくさんいただけました!ありがとうございます!今回は直接頂いた名刺の中から素敵なデザインのものを一挙紹介します!名刺を作成する際のデザインの参考にしてくださいね! ↑私が10年以上利用している会計ソフト! 私の名刺はこんな感じ 用紙やオプションなどの仕様は過去記事「名刺のデザインを新しくしました」を見てみてくださいね! ちなみに2018年9月23日(日)に広島で開催されるWebデザインシンキングセミナー in 広島では参加者募集中です!みなさんの名刺と私の名刺、ぜひ交換してください! 素敵な名刺頂きました いただいた名刺の中から、「これは!」と思ったものをいくつか紹介させて頂きます。すべて掲載できず

    Web業界で活躍する日本人の素敵な名刺デザイン 2018年版
    nisisinjuku
    nisisinjuku 2018/08/28
    うーん、Web業界ってか「名刺交換した人の変わった名刺を晒してくぜ!」ってことかな?
  • 1