背景 Web制作に携わる人間にはフォトショとイラレは必須！と口酸っぱく言われてるわけですが、独学で進める中ではそのスキルを担保するものを持ち合わせていないな... というところで、 ｢Photoshopクリエイター能力認定試験｣がみつかりました。 【試験公式サ…

背景 お題からワイヤーフレームとデザインカンプを制作するWeb配布課題に取り組みました。(有料noteです) Webデザインカンプを1から作るための説明書｜こばやす｜Webデザイナー｜note 成果物 それぞれブログ記事にまとめています。 PC版デザインカンプ(Figma…

背景 お題からワイヤーフレームとデザインカンプを制作するWeb配布課題に取り組んでいます。(有料noteです) 今回はSP版デザインカンプ制作について記事にまとめます！ 前回: fuchsia-84.hatenablog.com 課題元: Webデザインカンプを1から作るための説明書｜…

背景 お題からワイヤーフレームとデザインカンプを制作するWeb配布課題に取り組みました。(有料noteです) Webデザインカンプを1から作るための説明書｜こばやす｜Webデザイナー｜note 成果物 ワイヤーフレーム デザインカンプ 制作スケジュールと工数 12/7 …

【Webデザイン】オリジナルWebデザイン : 水族館の仮想HP - 2 背景用波形素材をつくる 背景 公開のワイヤーフレームからのデザイン作成課題。 前回は自作ロゴの作成についてまとめました。 今回は、セクション境界に使用した波形素材の制作についてまとめま…

背景 前回記事に基づき、 公開のワイヤーフレームからのデザイン作成課題。 まずは、水族館のロゴ作りからはじめました。 ロゴ作成についてまとめていきます。 成果物 制作時間 : 3.5h 自作ロゴ ロゴ使用のトップ部分 : コンセプト "さっぽろ水族館"という架…

先日はPC版コーディング内容をまとめました。 fuchsia-84.hatenablog.com 今回はSP版と全体の修正について。 レスポンシブ化に向けて行った内容をまとめます！ 成果物 PC or タブレット向け (992px以下769px以上) タブレット向け (768px以下545px以上) スマ…

背景 アイスクリーム専門店の仮想LPの作成過程をまとめています。 前回は、水彩背景素材の制作についてまとめました。 本記事では、同じくメニューセクションにて使用した 背景が透明な単体アイスクリーム画像の制作について まとめていきます。 制作物 単体…

背景 アイスクリーム専門店の仮想LPの作成過程をまとめています。 前回は、自作ロゴの制作についてまとめました。 本記事では、メニューセクションにて使用した 水彩背景素材についてまとめていきます！ 制作物 水彩背景画像 - strawberry 水彩背景画像 - or…

背景 アイスクリーム専門店の仮想LPの作成過程をまとめています。 前回は、ワイヤーフレーム作成についてまとめました。 fuchsia-84.hatenablog.com 続いて、画像素材の作成へ。 本記事では自作ロゴの制作についてまとめていきます！ 制作物 自作ロゴ 実際の…

背景 はじめてオリジナルデザインカンプをPhotoshopで作成しました。 すぐにコーディングに入ろうというところでしたが、 今までのnote模写課題の形式に則りまずはデザインカンプのXD化を考えました。 そこから、レスポンシブデザインもつくってしまいます。…

背景 前回記事からの続き、はじめてのWebデザイン自作シリーズ完結編です。 今回は、Photoshopにてデザイン作り込み。 成果物と、作業中のポイント、苦労した点についてまとめたいと思います。 成果物 はじめてWebデザインを自作することができました！ 制作…

背景 前回の記事で、Compで作成したワイヤーフレームをPhotoshopに取り込むことができました。 fuchsia-84.hatenablog.com これから作り込み...！と思った矢先、あれあれ...できないぞ...？？？という点がたくさんありました。 原因はWebデザイン作成のため…

背景 前回の記事で、Adobe Compでワイヤーフレームを作成しました。 fuchsia-84.hatenablog.com 今回はデザイン作り込みのため、そのワイヤーフレームをPhotoshopに取り込みます。 ぐぐったりして調査するも実際にできるまですこし時間がかかったので、自分…

今回は、ひらともや(Twitter: @hiratomoya)さんのnote記事コーディング練習用のデザイン~お花屋さんのLP編~で知った、Shiroコーディングに挑戦してみました！ デザインは、akane(Twitter: @omsss22)さんです。 学習項目とこの経験を振り返ると共に、Shiroコ…