Webデザイン講座
Webデザインやコーディング、フロントエンドに関する知識を学んでいただける講座を作成しています。
Udemy(有料)
プロになる基礎から実践まで!WebデザインからHTML5・CSS3(Sass)でのコーディングを全て学べる講座
![](https://i0.wp.com/asamone.com/wp-content/uploads/2018/04/udemy-2.png?resize=640%2C360&ssl=1)
サイト作成にあたって考えるべきことを学べ、成果物としてワイヤーフレーム作成まで行う思考編
Photoshopを用いてワイヤーフレームからデザインをし、成果物としてはデザイン作成まで行う デザイン編
HTML5やSass(SCSS)を用いてコーディングを行い、自己紹介ページの作成まで行う コーディング編
実際の私の仕事の流れを再現し、思考編・デザイン編・コーディング編を網羅した実践編。デザインのツールはPhotoshopではなくAdobe XDを使用。プロトタイプ作成からデザインフィードバックをもらう方法に加えて、Webフォントの使用やよく目にするアニメーションなど、全面的にトレンドを取り入れています。成果物としてはブログのトップページ、記事一覧ページ、記事詳細ページとなります。
一連の流れを学びたい方はもちろん、コーディングやデザインだけ学びたい方にもオススメの講座です。
コーディングするものは全てレスポンシブデザインで作成します。
Qiita(無料)
【爆速】HTML + Sass(SCSS)で簡単にレスポンシブ対応のLPを作ろう!
![](https://i2.wp.com/asamone.com/wp-content/uploads/2018/12/68747470733a2f2f71696974612d696d6167652d73746f72652e73332e616d617a6f6e6177732e636f6d2f302f37353730352f33323264393032382d326639622d643232362d393838372d6437643036653031656130382e6a706567.jpeg?fit=1024%2C768&ssl=1)
HTML5とSass(SCSS)、jQueryを使用して、レスポンシブ対応のWebページを作ります。
1枚のページで全てを伝えるものとなっているので、LP用のテンプレートとしてもご使用いただけて、学習用にも使用していただける解説付きの内容となっています。
【爆速】HTML5 + CSS3で簡単にWebデザインしよう!
![](https://i0.wp.com/asamone.com/wp-content/uploads/2018/12/FireShot-Capture-45-ASAMOTO-YUKI-https___asamone.com_qiita_simple1_.png?resize=640%2C315&ssl=1)
HTML5とCSS3を用いて1枚のWebページを作成します。
テンプレートとしても使用いただけますが、HTMLやCSSの学習にも活用いただける内容となっています。