背景 Webコーディング模写をしていて、ヘッダーのブランドロゴがsvgファイルでした。 元ページ : name of love 一般的にsvgファイルを作成となるとPhotoshopかIllustratorをつかうようですが、 今のところ気軽にさわれるのがXDだったので、XDでSVG書き出しで…

【定期振り返り-12月】 中旬より資格試験の勉強時間がひとまずカットされ、コーディングに時間をフル導入できるようになった12月は特に充実した月になった予感です！ 色彩検定1級2次を受験 1級2次の受験でした〜！ 感触としては、う〜む...という感じ^^; も…

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

成果物 スクリーンショット 動画 カンプ読み取り勘違い、ヘッダー部分のコンテンツ幅が全体と統一されてなかった(absoluteでleft150pxとか設定していた)修正済みスクショ。こういうのすり抜け注意..._φ(･_･ pic.twitter.com/pzC5ilg9Yp— ふーしゃ@web (@fuch…

元々予定していた上旬の家族旅行ではお宿にWifi環境無し、下旬には祖父の訃報で関西に飛ぶなどバタバタだった11月。 週1振り返りは望めなかったので、月全体を月1の定期振り返りとしてまとめます。(今後もこのシステムでいくかも) ブログ関連の主立ったこと…

新ポートフォリオサイト 可変グリッドデザインで画像を主役に。 キャプションからGitHub Pages公開ページとリポジトリに飛べるので、 ブラウザ上での動き・コードも見せられるようになりました。 背景 これまではGoogle Page作成のポートフォリオサイトを公…

Webコーディング模写 flickityのレスポンシブ切替部分の修正 初期化のエラーが出ていたため、修正中。 以下のページ参考。 Flickity - destroy,jQuery Webデザイン模写 購入note初級編のレスポンシブデザインをXDで作成。 fuchsia-84.hatenablog.com ポート…

成果物 スクリーンショット 作成したデザインカンプ 動画 続:きょうはスマホ版スライダー複数配置したプロトタイプはじめて作ったり、文字サイズや行間、改行位置など細かいところも考えて変えてみた。制作⏰: 2.5時間月末まで、1週間でコーディング目標#今日…

Webコーディング模写 先週、noteより購入したPC版デザインをもとに自作したタブレット版、スマホ版デザインカンプをもとにコーディングを完了。 fuchsia-84.hatenablog.com 合計時間は5時間とあまり長々とかけず、かつ予想外なクラス追加、htmlクラス分け失…

成果物 先日作成したデザインカンプを元に、コーディングを終了！ fuchsia-84.hatenablog.com スクリーンショット 全体スクリーンショット 動画 スマホ版#Webデザイン模写 #Webコーディング模写 #XD #HTML #CSS #JavaScript #今日の積み上げ pic.twitter.com…

Webコーディング模写 Twitterで知ったちづみさんnoteを2つ購入。 ちづみさんnote-コーディング模写入門編 、 ちづみさんnote-コーディング模写初級編 Webコーディング模写用のデザインが購入できました！ 練習用、と記載でポートフォリオ掲載もOKとのこと。 …

成果物 デザインカンプ 動画 スマホ版(制作時間⏰:合計4時間)#Webデザイン模写 #Webコーディング模写 #XD #HTML #CSS #JavaScript #今日の積み上げ pic.twitter.com/GA9RWV5FqH— ふーしゃ@web (@fuchsia_84) 2019年10月10日 制作期間 10/9~10/10 合計4時間 学…

10月分2つめとして、ちづみさんnote-コーディング模写入門編に挑戦！ 成果物 スクリーンショット 動画 【Webコーディング模写】10月分2同じくちづみ@098ra0209 さんnoteから、入門編。16:00はじめて18:00おわり⏰シマエナガは可愛すぎる、、さきに初級編にト…

Twitterで知った ちづみさんnote-コーディング模写初級編 を購入。入門編があるのに勢い余って←初級編からスタート。 成果物 スクリーンショット 動画 【Webコーディング模写】10月分ちづみ@098ra0209 さんのnote初級編に挑戦2日間合計12hくらい。XDデザイン…

Webコーディング模写 1ページ終わらせることができましたー！ fuchsia-84.hatenablog.com Webデザイン模写 【Adobe XD】自動アニメーションでスライドをつくってみたで、ドッドまで一緒に流れていた問題を解決！ fuchsia-84.hatenablog.com その他 はてなブ…

9月分のWebコーディング模写が1つおわったので、 そのまとめです。元ページ - Name Of Love 参考書籍 : 久保田涼子著「Webデザイン良質見本帳」SBクリエイティブ株式会社 成果物 ※12/28 画像差し替え対応済。 学習項目 HTML/CSS/JavaScript ハンバーガーメニ…

前回 先日、Xdでスライド作成の記事をまとめました。 しかし、前回の段階ではドットも一緒に流れてしまっていました。 今回修正できたので、別記事としてまとめます。参考書籍 : 久保田涼子「Webデザイン良質見本帳」SBクリエイティブ株式会社 成果物 このま…

旅行から帰ったら、一気に季節が進んでいました。 秋服追加でホクホク、 はじめてXdさわってホクホクの1週間。北の大地はすぐ雪が降って冬まっしぐら、 秋が特別みじかく感じるので めいいっぱい秋をたのしんでいきたいところ！ Web模写 引き続き、こちらの…

背景 Webデザイン模写の一環として、Xdのプロトタイプをさわってみることに。 (人生初のXd、基礎理解も兼ねています。)模写しているページは、こちら。Name Of Love Topページに大きなスライドがあるので、 これをXdで再現することにしました。参考書籍 : 久…

Twitter・はてなブログでのアウトプットをはじめてから スクリーンショットを撮る機会が増えました。その度に、 「ショートカットキー、なんだっけ？！」とググってる気がしたので こちらにまとめ。誰かの参考になれば...macOS Mojave のスクリーンショット…

9月の3週目！ 旅先からの更新です。 野鳥撮影の旅 家族で連休をいかして 日曜から野鳥観察の旅へ出かけています。宿は大体、翌日に晴れるだろうところに当日予約というパワープレー、 日の出とともに出かけ、早朝は鳥さんにご挨拶。 お昼以降にWeb模写or資格…

厳しい残暑も終わり、ようやく秋の気配です。 さて、ここ1週間を振り返ってみましょう。取り組んだのは、以下です。 新しい環境作り Webコーディング模写 Webデザイン模写 色彩検定の勉強 新しい環境作り ブログ新設 Twitterアカウント新設 ポートフォリオ改…

はじめまして！ 元SE・PGからフロントエンドエンジニア(主にWebデザインとコーダ)を目指す アラサー女、ふーしゃです。 勉強した内容を中心に、日常や趣味なども書いていきたいとおもっています。当面の目標 Webコーディング模写・デザイン模写 (1セット/月…