Design

Design

デザインツールの点と線の話

Photoshop:Illustrator = 点:線 フォトショ=ビットマップ(点):イラレ=ベクター(線)。ん?Figmaはどっち?フィ?フィグ?もしや、フィマ? 意外とここ、考えてなかった気がす…

その画像、本当にSVGでしょうか?

SVG画像はベクター形式なので劣化がなくてキレイかつ便利!とお思いのみなさま、突然ですがSVG画像の「中身」を見たことはありますでしょうか。 SVG画像が上記のような特徴を持つのは、画像としても扱える…

正円には勝てん話

デザインしていると、ふと、どうしようもない無力感に襲われる。虚無。その虚無の原因のひとつが“正円(真円)”ではと気づいた話。 正円は、あまりにも、強い 例えば、ロゴのシンボルを正円の中に収めようとした…

After Effectsで桜吹雪を作ろう

4月になりオフィスの前の公園にも桜が咲く季節になったので、今回はAfter Effectsを使用して桜吹雪のアニメーションを作ってみようと思います。 作り方の手順 簡単に作り方の手順をまとめると、 桜…

方眼紙のような背景をCSSで作る

課題 方眼紙のような背景を画像で実装していたが、実機で拡大すると下記の通り途切れたように見える部分がある。 原因 ピクセルのズレと丸め誤差スマホの画面に合わせたり、ピンチアウトで拡大したりすると、ブラ…

【Illustrator】 図形の拡大縮小で線幅が変わらない時の解決方法

Illustratorで図形を拡大縮小したときに線幅だけ変わらない問題の解決方法を、画像付きで分かりやすく解説しました。

印刷データからWebデザインを作る時のポイント【画像編】

印刷用データの画像を使ってWebデザインを作成する際の2つのポイントをまとめました。

【Figma】画像にシャドウを付けると境界線がついてしまう

Figmaでトリミングした画像にシャドウをつけると、背景色の境界線が表示されてしまう時の解決方法をご紹介します。

ミイラ取りがミイラのミライをつくる話

“AIがデザイナーやエンジニアの仕事を奪う”そんな言葉を見聞きするたび、「ミイラ取りがミイラになる」のようで、なんだかモヤモヤ。 AIは、どこからか急に現れた存在じゃない インターネットも、スマートフ…

Photoshopで切り抜いた画像に白縁をつける方法

切り抜き画像は、背景に埋もれて見えることがありますよね。本記事では、Photoshopで切り抜いた画像に白縁をつける方法をわかりやすく解説します。 1.切り抜いた画像を用意する 2.対象のレイヤーを選…

Webデザイナーが業務で使っているChrome拡張機能

Web制作の現場では、デザインツールの操作だけでなく、リサーチや検証も欠かせません。本記事では、こうした業務を効率化するChromeの拡張機能を3つ紹介します。 1.WhatFont Webページ上に…