はてなブックマーク

独立して11年、気がついたらwebの人になってましたが、ところでwebってなんでしょうね。 ってことで薬なしでは生きられない絶賛病み中たあですこんにちは。 Webの未来について ここんとこ「Webの将来」というテーマが増えてる気がしますね。しません？わたしだけ？ 増えてるんですよ多分。そういうことにしてください。 そんなわけで、わたしもご多分に漏れず、先日メンバーズキャリアさんの『移転パーティ！MCmeetup#01「IoT・AIで変わるWebの未来」』と言うイベントに呼ばれて「Web制作の未来のお話」とやらを偉そうにして来ました。 そもそも今回のイベントはIoTやらAIやらのお話があって、そのあとに「Web制作者にこれから学ぶべき技術とかの選び方なんかを話してよ」と言われ、そんなもん私が知りたいOK任せとき！と受けたわけですが、自分の中でいろいろ整理してみて、勿体無いのでブログにしておこ

最近のWebデザインは写真とタイポグラフィ、そしてシンプルな区切り（グリッド）などで表現されることも多く、その中で少しでも面白い見せ方を考えると、曲線や角度など、ちょっとしたアクセントが欲しくなったりします。 ということで、今回はこちら。 ワンカラムに多いコンテンツ区切りを角丸で描く つまりこれですね。 これまでは「マスク画像」として、png画像を乗っけたりして一部を隠すように表現していたことが多いかと思いますが、よくよく考えたら別にCSSでできるもんねぇ。 今までこの手のコーディングをする機会がなく、使いそうで使ってなかったので、メモとして残します。 まずはhtml <div class="wrap"> <div class="arc"> <p> なんか本文 </p> </div> </div> class=”arc”部分の下部で円弧を表現します。 説明が面倒なのでCSSはこちら .wr

拡大縮小なんのその、ベクターと言えばこのツール。 ということで、そんなIllustratorを起動しない日は年に50日くらい、ベクターデータと戯れるデザイナーたあです。 近年はSVGイエーイってことで、「Webデザイン？Photoshopに決まってんだろすっとこどっこい一昨日きやがれ！」と言われることも少なくなってきて、わたし大好きIllustratorも再度見直されているのをひしひしと感じでおります。 でもね。 ちょっと前にイラストレーターからSVG書き出しをしたら「あれこれ思ったのと違う感じになっちゃった」ってこともよくあって、一度「Illustratorで効果や加工をかけたオブジェクトをSVGで書き出したらどうなるか」試してみなきゃな。とか思っていたんです。で、以前試したんです。 その結果をご報告しますので何かの参考に（たぶんならないけど）してください。 まずはどんなデータを書き出し

Illustratorのネタを持ち寄って話し合う会に参加させていただいたのですが、そこで Illustrator大好きなわたしが思わず小躍りしたくなるプラグインを教えていただいたのでご紹介します。 ツールごとにワークスペースをスイッチするWorkspaceSwitcher 手抜きLab＠DTPの現場にも詳細が記載されていて、PhotoshopやInDesign版もある、てまり ‏@ten_A_cclab さんが開発されたプラグインです。 ExtendScriptではなくC++で作られているらしく、動作も快適でかなり素早く動いてくれます。 GitHub – ten-A/WorkspaceSwitcherforAI で、何ができるの？ 先にこれから説明したほうがいいと思います。 皆さん「ワークスペース」どうしてますか？ウィンドウパネルを別モニタに並べて作業スペースを確保している人もいると思いま

どうもこんばんは。 初老のデザイナーたあです。 簡潔に書きます。 タイトルを挟む1pxとかの横線を簡単に書くCSSを一生懸命考えてみたので忘備録。 こういうやつですね .title-border { display: flex; align-items: center; } .title-border:before, .title-border:after { border-top: 1px solid; content: ""; flex-grow: 1; } .title-border:before { margin-right: 1rem; } .title-border:after { margin-left: 1rem; } これを線を入れたいとこに入れるだけっす。 こんな感じで <div class="title-border">これ</div> 以上でした。 なお余白の取り方