강의

멘토링

커뮤니티

Programming

/

Front-end

本当!ウェブサイト制作! Step By Step! (「フォーメイン」_フルページサイト制作)

本番! ウェブサイト制作 Step By Step! フォーメイン(https://www.phomein.com/brand/main/main.do) 、実装してみる過程で複雑なレイアウトも簡単かつ迅速に制作する実務コアノウハウをそのままお知らせします^^

  • jyoung
HTML/CSS
Interactive Web
Clone Coding
jQuery

受講後に得られること

  • 実務に適したレイアウト制作方法!

  • フルページスクロールレイアウトの作り方!

  • デプスのあるGNBナビゲーションの制作方法!

  • 数字カウントアップの作り方!

  • アニメーションが入ったイメージスライドの作り方!

  • 様々なスクロールアニメーションの作り方!

自分で作って学ぶウェブサイト!
J. Youngと一緒にクローンコーディングに挑戦してください。

HTMLタグとCSSプロパティは知っていますが、
レイアウト制作は他人の話ですか?

発売されているウェブレイアウトをそのまま製作することで本番のウェブサイトレイアウトを製作できます!


HTMLとCSSだけを知っていても
インタラクティブウェブ制作OK!

  • このレッスンでは、HTMLとCSSに関する基本的な知識を持つ方を対象に、実際のWebページをそのまま実装して進行されます。
    • HTMLマークアップ、CSSデザインの基本的なカット!
    • 本当!レイアウト制作の様々な例を取り上げることで、レイアウト制作に自信と興味UP!
    • クローンコーディングレイアウトまで挑戦してみてください!


Step By Step!
今すぐ始めましょう。

Webページの制作に必要なjQueryの基礎から活用まで学ぶことができ、様々なライブラリやプラグインを活用して短時間で素敵でカラフルなWebページを制作できるよう、皆様をお手伝いいたします。

実務で必要なインタラクティブな要素で構成されたWebページ講義により、業務スキルと実務コアノウハウを一度に得ることができます。

実務は!スピード戦であり、スケーラビリティです。
作業時間内にすばやく、クオリティのプロジェクトを完了する方のみが実力あるデザイナー、パブリッシャーとして認められ、扱われます。

フォーメインサイトを一緒に作ってみながら、派手なウェブサイトも素早く制作していけるノウハウを身につけてみてください!


  1. 実務に適したhtmlとcssを用いた正確なレイアウト制作方法
  2. フルページスクロールレイアウトの作成方法
  3. Depth GNBネイトの作り方
  4. 数値カウントアップの作成方法
  5. さまざまなスクロール時に進行するアニメーション
  6. アニメーションが入った画像スライドの作り方

実際の例が気になったら?

フルページレイアウト
画像スライド
GNBナビゲーション
Fullpageナビゲーション

20年経歴の実務+講義ノウハウ
J.young

こんにちは? J.youngです。

20年間、Webデザイン&アプリ開発会社でデザインチーム総括でチームを運営しており、しっかり大学と学校および職業訓練機関でUIUXデザイン、ウェブデザイン、ウェブパブリッシャー、フロントエンド開発講義を行っています。デザインやコーディングの基礎が全くない学生を対象にウェブデザイナー/パブリッシャーなど専門家養成のため

  • 基礎から実務まで!
  • 実務で欲しい!
  • 実務ですぐに使えるポートフォリオ制作!

講義を進めて専門家として堂々と実務に進出できるよう指導しています。それだけ多くの弟子たちが現職デザイナーで、パブリッシャーでその力量を発揮しています。

  • Webデザイナーやパブリッシャーになりたいのにどこから始めるのか
  • 離職のための正規コース学園に通いたくても職場生活のために厳しくできない方
  • コーディングの「鼻」を知らない人
  • 学園やYouTubeなどでHTML/CSSの基礎は学んだが、導通ウェブサイト制作が他の話だった方々

J.youngがお手伝いします!

また、学習していただきたいことがありましたら、コメントを残していただければ、お役に立てる答えをお寄せいただくよう最善を尽くします。

オープンチャットルーム運営

よりスムーズな学習のために、J.youngが運営するよくあるウェブディーオープンチャットルームに加入すれば、
ピグマ、UI.UX、コーディング、ポートフォリオ製作関連の核蜂蜜チップと無料ウェビやリンクなどを共有いたします。

- オープンチャットルーム:よく知られたウェブディ
- コード:jyoung

実務キャリア

  • 2015~2017(株)エリエセル総括取締役
  • 2003~2015(株)アミュージングウェア総括取締役
  • ~2003 ソウ氏アンディデザイン実装

講義やその他のキャリア

  • 元気なウェブディYouTubeの運営中
  • 仁川文芸専門学校(マルチメディアウェブ講義)
  • ソウル現代職業専門学校(スマートウェブ/アプリ講義)
  • ポリテック大学(デザイン講義)
  • 韓国IT専門学校(マルチメディアデザイン講義)
  • タップ職業専門学校(デザイン講義)
  • 光明市女性ビジョンセンター(ウェブデザイン講義)
  • 今コンピュータ学園講義のブンダン店(デザイン講義)
  • ザ・ジョウンは、コンピュータアカデミーの瑞草店([ウェブデザイン機能士]デジタルウェブ&アプリデザイン - コース評価型資格-A)
  • ハイメディアコンピュータ学院の序点(映像を活用したUI/UX Webデザイン&Webパブリッシング)

こんな方に
おすすめです

学習対象は
誰でしょう?

  • HTML / CSSの基礎はありますが、Webページの作成が恐れている人

  • Webデザイナー、パブリッシャーとして就職のために迅速にポートフォリオを制作したい人

  • Webで必要なjQueryソースを習得したい人

  • JavaScriptの基礎なしに実務で必要とするインタラクティブWebを簡単に実装したい人

  • 現在グラフィックデザイナーとしてフロントエンド開発者やパブリッシャーに転向したい方

  • ウェブデザイナーとして業務スキルを向上させたい方

  • スケーラビリティを考慮したインタラクティブWebを迅速に実装したい方

こんにちは
です。

8,823

受講生

354

受講レビュー

227

回答

4.8

講座評価

14

講座

 안녕하세요? J.young 임자영입니다.

20여년간의 웹디자인 & 앱개발회사를 운영하며, 대학과 전문학교 및 직업훈련기관에서 UI.UX디자인,웹디자인, 웹퍼블리셔, 프론트엔드개발 강의를 하고 있습니다.

디자인이나 코딩에 대한 기초가 전혀 없는 학생들을 대상으로, 전문가(UI.UX디자이너/ 퍼블리셔/코딩하는 디자이너) 양성을 위해!!
- 기초부터 실무까지!
- 실무에서 원하는!
- 실무에서 바로 써 먹을 수 있는 포트폴리오 제작! 강의로 전문가로써 당당히 실무에 진출할 수 있도록 지도하고 있습니다.

그런 만큼... 많은 제자들이 실무자로써의 그 역량을 발휘하고 있습니다.

-UI/UX디자이너, 퍼블리셔, 프론트엔드개발자가 되고 싶어도 어디서 부터
어떻게 시작할지 막막하신 분들..
- 이직을 위한 정규 코스 학원을 다니고 싶어도 직장 생활로 인해 엄두도 못 내시는 분들..
- 코딩에 '코'자도 모르시는 분! 학원이나 유튜브 등으로 HTML/CSS기초는 배웠지만 -
도통...웹 퍼블리싱 개발 구현이란 남의 이야기이신 분들....

J.young이 도와드리겠습니다.!!
또한!! 학습하시다 궁금하신 점 있으시면 댓글 남겨주시면
도움이 드릴 수 있는 답을 드리도록 최선을 다하겠습니다.

* 오픈채팅방운영

보다 원활한 학습을 위해, J.young이 운영하는 잘난웹디 오픈채팅방에 가입하시면,
피그마, UI.UX, 코딩, 포트폴리오제작 관련 핵꿀팁과 무료웨비나 링크 등을 공유해드립니다.

오픈채팅방명 : 잘난웹디
코드 : jyoung

 

실무경력

- 2017~현) 웹개발 Director
- 2015년~2017년(주)엘리에셀 총괄 이사
- 2003년~2015년 (주)어뮤징웨어 총괄 이사
- 2003년: 서우씨앤디 디자인실장


- 현) UIUX & 웹포트폴리오 강의 진행 중(실무 진출 90프로 이상)

 

감사합니다^^ 


운영중인유튜브

잘난웹디
https://www.youtube.com/channel/UCISuuIbv_SnkE6d4oDgrBWQ

カリキュラム

全体

16件 ∙ (2時間 31分)

講座資料(こうぎしりょう):

授業資料
講座掲載日: 
最終更新日: 

受講レビュー

全体

4件

3.5

4件の受講レビュー

  • joofeel00005834님의 프로필 이미지
    joofeel00005834

    受講レビュー 1

    平均評価 5.0

    5

    50% 受講後に作成

    いいですね。

    • jyoung
      知識共有者

      主必規の受講評価ありがとうございます。 熱いです。 インタラクティブなウェブ制作ができる実力を育ててくれて応援します。 ありがとうございます〜 J.youngドリーム

    • jyoung
      知識共有者

      ジュピルギュ様受講評価ありがとうございます。 フォーメインを完読していただければ、ミュージャインと対戦インタラクティブウェブを強調します。 レイアウトボックス構造の理解と レスポンシブウェブ、 インタラクティブWebを作成するのに役立ちます。 と思われます。 熱気です〜〜 ありがとうございます^^ J.youngドリーム

  • office1895님의 프로필 이미지
    office1895

    受講レビュー 1

    平均評価 3.0

    3

    100% 受講後に作成

    ライブラリの内容とダウンして適用する方法をもう少し説明していただければ幸いです。 (slick と fullpage)ライブラリの説明は添付されているファイルと少しの説明で終わりや残念がたくさん残ります。 講義は早くするために言うたびにタムを編集して速い感がありますが、倍速を遅くすればとても合うことができます。 それでも fullpage と transition の使用はコードがシンプルになっており、使いやすくなります。 そして、完成しているファイルではなく、ライブラリだけが追加されているファイルがあったら、コードをたどるのにはるかにきれいだったようです。 良い講義ありがとうございます。

    • gudghk07212222님의 프로필 이미지
      gudghk07212222

      受講レビュー 1

      平均評価 3.0

      3

      50% 受講後に作成

      スピードが速すぎてただフォローして忙しいです... ビデオをすばやく編集したかどうかわかりませんが、話が終わる前に別の言葉が続きます。プレイして.. 0.75倍速にしても早いです。 スリックスライダーやフルページの説明も少し不足しているようですが、よく理解できません。聞いてはいけないと思います。

      • hyeree19930226님의 프로필 이미지
        hyeree19930226

        受講レビュー 1

        平均評価 3.0

        3

        100% 受講後に作成

        講義はいいですね:) モバイル画面ではないのが少し残念です。そして講義は少し速いですㅠㅜ

        • jyoung
          知識共有者

          HYEREE AHNさん〜 本フォーメイン講座は、フルページ制作の方法と、カウントアップ、アクティブ時に行われるアニメーション、GNB MenuBarなどをお知らせするために制作された講義です。 反応型を勉強したい場合は、助けるアプリケーションやミューザイン講義を聞けばいいですし、そして映像は退屈をなくすためにわざわざ素早く編集しました。 今日も良い一日を過ごしてください〜J.young夢

      期間限定セール、あと6日日で終了

      ¥18

      27%

      ¥3,913

      jyoungの他の講座

      知識共有者の他の講座を見てみましょう!

      似ている講座

      同じ分野の他の講座を見てみましょう!