Natural History ナチュラル ヒストリー 【 博物誌 】
  • svg で自由に描こう！vol.01 【 お魚を書く！できるかな？ 】 2018/05/31 svg 続きを読む
    Illustrator で描いて svg に変換したベジェ曲線データを、自在に書きなおすことができるのはわかったとして。一から書いてないから本当にできるとはいえないんじゃないの？と、私の中でつっこむ声が聞こえます。はたして、テキストエディターだけで、フリーなベジェ曲線のイラストが描けるのでしょうか？もう、やるしかありません！とはいっても、はじめからまったく目当てもなしに描くのはムリだと思うの。原図を用意。 手描きで... 続きを読む
  • Illustrator から svg！vol.06 【アンカーポイントを追加しよう！】 2018/05/30 svg 続きを読む
    ラストスパートです！この部分の書きかえポイント。クジラの潮の部分。元に比べて。大きさもちがうし、形も変わってる。 数もふえてます！スタイルを変えた時に、複合パスから切り離した二つ。＜path class="cls-4" d="M194.31,82.9c5.76-6.38,14.56-5,15.06.75.86,9.92-15.39,1.32-25.69,20.17C183.68,103.82,187.51,90.41,194.31,82.9Z”/＞＜path class="cls-6" d="M162.69,75c2.58-4,7.53-1.65,10.58,1.14,2-6.48,5.37-7.1,8.37... 続きを読む
  • Illustrator から svg！vol.05 【自由なベジェ曲線は描けるの？】 2018/05/29 svg 続きを読む
    最初からこの記事におつきあいしていただいてる方は、もう座標も読めちゃうしハンドルも動かせちゃう。じゃぁ、本当に自由にベジェ曲線は描けるんでしょうか？すでにあるイラストを書きかえましょう。あっ・・・【描画】を「描く」【データ】を「書く」としてます。先にスタイルを変更した、このバナー。どん！どうでしょう？！自由なベジェ曲線は描けます！かなり大変だけど！！ちょー手間がかかるけども！！！はっきりいって、全... 続きを読む
  • Illustrator から svg！vol.04 【ベジェの座標を読んでみる！】 2018/05/27 svg 続きを読む
    ベジェが大好き！ 寝ても覚めてもベジェ！！ベジェをわがものにしたいー！！！という、私のようなおかしな方のためにおおくりしてます。その前に、ブラウザーでプレビューしながら動かしてます。いまさらですが・・・ viewBox の指定を。書き出したそのままだと、viewBox からはみ出ると表示されません。そして、座標 0,0 がブラウザーの　left 0・top 0 になるから、left・top にオブジェクトがくっついてしまいますよね。viewBox... 続きを読む
  • Illustrator から svg！vol.03 【スタイルを変えてみよう！】 2018/05/27 svg 続きを読む
    svgデータ をいじって遊びましょう！前回言い忘れていました。Illustrator から書き出すとき、アートボードをオブジェクトより大きくしていると。polyline・polygon の座標は大丈夫でしたけど、path の座標は、 transform で位置を調整されていました。なので、アートボードをオブジェクトに合わせてから書き出した方がわかりやすいです。最初は、現実的にスタイルの変化。こちら、厳密にはデータの変更ではありません。スタイルを... 続きを読む
  • Illustrator から svg！vol.02 【実際どんなデータなの？】 2018/05/26 svg 続きを読む
    Illustratorデータを svg にすると、実際どんふうに書かれるの？と思っている方むけに。 プロの方は無視しちゃってくださいね。svgデータ といっても、円や矩形など「図形」の扱いについてではありません。【 フリーのベジェ曲線 】についてです。役に立つのか立たないのかもわからない！どっちかといえばわからなくてもいい！！というお話です。では、始めましょうね。こんなデータを用意しました。レイヤーには、1・グラデーショ... 続きを読む
  • Illustrator から svg！vol.01 【どんなデータでもいけるのか？】 2018/05/24 svg 続きを読む
    サイトのリニューアルにともない画像を svg へ。どんな構造の Illustratorデータ でもいけるのでしょうか？今回のデータは、こんなでした。まずは、ホームに使っているコンテンツアイコン。コラムの区切りのイラストも。これが問題ないのはわかります。アイコンはすべて、複合パスで抜きになってるけど大丈夫！少しづつ複雑に。同じクジラでも、メインのこのこ。カラーベタで描かれてます。そして、輪郭線にカリグラフィーブラシを... 続きを読む
  • リニューアルしなければ！vol.09 【 svg だ！】 2018/05/21 Web 続きを読む
    ここからは、個人的なお試しです。web画像といえば、昔は jpg、近年復活してきた gif 。主流は、png なわけです。以前のサイトデザインは、ほぼ画像。Photoshop でデザインして、スライスして配置していました。今はしないですよね？画像の扱いってずいぶんかわりました。そして、svg 。やっぱり、使わなければ！svg は、ベクトルデータ を、テキストで現したもの。とりたてて新しい形式ではありません。昔、Illustrator のデータ... 続きを読む
  • リニューアルしなければ！vol.08 【無駄を描いちゃう！】 2018/05/21 Web 続きを読む
    サイトの最終的なチェックと仕上げをしています。いつも、これが時間と手間が必要です。私のように個人的にやってると、実際にアップしたものを見てもらう以外に、多くの機種で検証する手立てがありません。っで、不具合があると教えてもらってちまちま修正。その合間に、デザインについてもうちょっと。コーディングのお話ではないよ！プロのデザインスタジオが作ったサイトは、それはそれはすてき！そしてそれは、今年のトレンド... 続きを読む
  • リニューアルしなければ！vol.07 【フラットでミニマルだよ！】 2018/05/07 Web 続きを読む
    もうーほんとに最初のころ。「ホームページにはピクトだけを並べたい。 テキストは排除したらかっこいい。」って作ろうとしたら・・・。「そんなの、つまらないし、検索にかからないからダメだろう？」と、一蹴されちゃいました！そうりゃそうだ。当時の検索エンジン事情を考えたらその通りです。今は大丈夫！やっと、フラットでミニマルな時代がやってきましたぁー！・・・とはいってっも、このサイトの運営も 9年。地道にやって... 続きを読む
次のページ

mayahuel

ブログ内検索


最近の記事

カテゴリー

カレンダー

04 | 2018/05 | 06
日 月 火 水 木 金 土
- - 1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31 - -

月別アーカイブ