Design

5

CSSとJavaScriptで簡単なアニメーションを作ろう

はじめに

この記事では、CSSとJavaScriptを使って、Webページに簡単なアニメーションを実装する方法をご紹介します。
筆者が実際の案件で制作したコードをもとに解説します。
また、有料記事ではソースコードもダウンロードいただけますので、JavaScriptが得意ではない方でも、お使いいただけます。

成果物

本記事では、下記のようにスクロールと連動してアニメーションを実行できる方法をご

もっとみる

Webサイトのメインビジュアルの構図を集めて分析してみた。

初めまして、ameko(@tk04amedama)と申します。
普段は都内の制作会社でWEBデザイナーをしています。
と言ってもまだまだ新米なので、日々勉強中です。

その勉強の一環で、最近のWebサイトで使われている
メインビジュアルの構図を一覧にしてまとめた画像をTwitterに投稿してみたところ、思いがけず多くの方に反応いただけたので、その後に行っていた構図ごとの分類分けや分析も公開してみよ

もっとみる

暑くて外に出られない…そんなときにおすすめのiPadを使いこなしている海外クリエイターの動画まとめ

少しでも空いた時間があればiPadでなにか作っているのですが、その際に海外のクリエイターの制作動画を見て参考にしています。
ここ最近ハマって見ている海外のクリエイターの方をまとめてみました。

創作意欲が掻き立てられること間違いなし!
空いた時間があればぜひ見てみてください!

基本みなさん英語なのですが、言葉なし&BGMのみでひたすら制作過程を撮ってあるだけのものもあります。基本、絵を書いている

もっとみる
ありがとうございます💕
73

Adobe XDプラグイン「Invisible Space」

Adobe XDのプラグインを作りました

XDでデザインシステムっぽく、ロゴやアイコン、Webコンポーネントなどのパーツ群を制作・管理するときに、ブランドガイドラインで定められたロゴのアイソレーションゾーンや、各種スタイルガイドで決まっているmarginやpaddingをお手軽に視覚化する、「Invisible Space」というプラグインを作りました。

まず、XDの「プラグインを見つける」か

もっとみる

アプリUIデザインで使ってるツールまとめ。

こんにちは、あゆみ( ayumiueda_)です。

2月から、実践型デザイン学習サービス『Cocoda!』で、毎日1つ出されるお題に沿ってアプリUIなどのデザインをするDaily Cocoda!にチャレンジしています。(今日までで25日連続ー!)

Webデザインも昨年からやっているレベルなのですが、UIデザインはまたそれとは結構別物で、初心者ながら見よう見まねで頑張っています。

さてさて、私

もっとみる
ありがとうございます☺️
826