CSS

CSSのみで実現するカルーセル画像スライド

サイト内に自動再生のカルーセルスライドを表示させたい場合に、よく使われているのが「slick 」ですが、JSを使わずにCSSだけでシンプルに表現することができます。マウスホバーでスライドを停止させたい...
Illustrator

印刷物を入稿するときに気をつける画像解像度のこと

商品写真などを使った印刷物を入稿しようとするときに、データ容量が重すぎる!と思ったことはありませんか?商品カタログや施設パンフレットなど、カメラマンが撮影したキレイな写真をそのまま使いたい!と思って、...
SERVICE

Google提供の画像圧縮ウェブツールSquooshを使ってみる

Webサイト制作やブログを書いていると画像の表示にタイムラグが発生したりしてイライラすることってありませんか?そのちょっとしたタイムラグがユーザーを逃している可能性があります!画像の容量が必要以上に大...
CSS

文章をCSSで両端揃えにする方法

まとまったテキストを配置する際に、両端がずれているとちょっと気になることありますよね?WEBサイトでも紙面デザインのように「両端揃え」でテキストを配置したい場合は、CSSのみで実現可能ですので取り入れ...
DESIGN

デザイナーに必要な8つのマインドセット

新人のデザイナーさん向けに、デザイナーとして仕事をするうえで、私が大事だと思うマインドを整理してみました。数年前と今では、違ったことを考えるようになったなぁと実感しながらどんどん湧いて出てきてしまうの...
Illustrator

QRコード画像をパスに変換する方法

QRコード素材などをクライアント様から指定画像で受け取る場合がありますが、解像度の問題や読み取り具合によって、そのままチラシなどに配置できない場合があるかと思います。可能な限り、QRコード画像をベクタ...
ブログ

誰でも写真で副業ができる可能性について

趣味で写真を撮るデザイナーもきっと多いはず、私も写真を撮るのがいつしか趣味になっているので、何かお金になる方法はないかなと思い「ストックフォトサービス」でいくつか写真を販売してみてはいるもののイマイチ...
jQuery

続きを読むでアコーディオンが開くjQuery・CSSの記述方法

お知らせやQ&Aなどで、途中までの文章を表示しておいて「続きを読む」ボタンでアコーディオンが開いて全体を表示させたい時があります。そんな時は、ちょっとしたjsとcssで実現できますのでやってみましょう...
CSS

flexboxで横並びを意のままに!

要素を横並びで配置するとき、かつてはfloatプロパティを使って左に流し込んでいた人も多いと思います。今では「flexプロパティ」を使うことでコードもスッキリ記述できるようになりました。グローバルナビ...
生成AI

Photoshopの生成拡張機能の使い方とアイデア

Photoshopには「生成拡張」と「生成塗りつぶし」という便利な拡張機能が実装されています。今までスキルが必要だった合成処理などが誰でも簡単に出来るようになりました。今回は「生成拡張」機能について使...
DESIGN

あなたが他者より抜きんでるには

個人事業主や小さな会社の社長に必要なブランディング思考。売上を上げるための、誰にでもできる小さな工夫の数々が記されています。・大手と同じことをしようとしても勝てるわけがない!・二番煎じで同じことをして...
ブログ

どんなサービスがお得か?を考える前に必要性を伝えなさい。

例えば、個室でのパーソナルトレーニングの契約を売りたいという案件を担当してるとします。筋トレって誰にとっても絶対に必要なサービスではないですよね?元々「トレーニングをしたい!」という意欲的な方や、「個...
CSS

縦書き文字を上下左右の中央にCSSのみで配置する方法

和風ホテルや割烹料理店などの公式サイトで「縦書き文字」を上品に使っているのをよく見かけます。今回の記事はピンポイントで「縦書き文字を画面や親要素の中央に配置する方法」をご紹介します。左右の中央に配置す...
ChatGPT

ChatGPTに商品をPRするリリース文を考えてもらおう

新商品を開発してローンチする際に、SNSやプレスリリースで商品の特徴や魅力をしっかりと発信していきたいもの。ではいざ魅力ある文章を考えるのって結構難しいですよね。そこでChatGPTではどのような文書...