
2024 ピグマUI3基礎+実務タンタン超スピード 頑強コース
jyoung
2024年度に新しくアップグレードされたピグマUI3バージョンで、基礎から実務まで体系的であり、簡単かつ迅速に頑張ることができるように構成されました。
入門
ui, Figma
HTML5とCSS3を活用してウェブサイト(ハンファキャミカル/ソリューション)を制作実習過程で、 PCモードレイアウトとレスポンシブページ制作を完全に理解し、活用できる 本番!ウェブページ制作! Step by Step!のBasic Course講座です。 (講義完成ファイル付き!)
受講生 291名
難易度 初級
受講期間 無制限
学習した受講者のレビュー
5.0
김혜경
AdobeでBracketが初めて出たときに歓声を上げた1人でした^^ エディターはさまざまですが、講師がブラケットで講義してくれて印象的でした。 レスポンシブページを作成しながら、基本的な部分を慎重に教えてくれてありがとう。 タグ理解から開発者ツール活用法まで本当にお得な講座よく聞きました。 周りの知人に強力推薦したい講座、これからもたくさん開設してください。 暑さに疲れないで健康に気をつけてください^^
5.0
ws k
本当に満足な講義でした。 講義で使用するhtmlタグやcss属性はほとんどすべて知っているものです。 コードを打ち、保存し、F5を押すたびに画面が変わることは驚くほど不思議でした。 次の講義も期待され、良い講義を頂きありがとうございます。
5.0
조동찬
現在個人事業をしている40代前半の仮装です。今後の第4次産業革命時代に備えて、IT関連技術の核心であるコーディングに関心があり、基礎から身につけ、会社のホームページも直接製作するつもりで検索し、講師の講義を受講することになりました。 HTMLとCSSの基礎だけを知っている状態でしたが、講師様の講義を聞いて実際のウェブページを制作してみると理解が上手くなり、実際の活用法も多く学びました。この講義をきっかけにウェブページ制作に対する自信を得たとても役に立つ講義でした。講師の大方産業講義もまもなく受講予定です。講師の講義で学んだことを基に、素敵な会社のホームページも作り、関連するJavaScript言語も学習し続け、フロントエンターテインメントの開発までしてみようと思います。ありがとうございます。
WebアクセシビリティHTML 5 MarkUp - 文書構造の定義
様々なCSS3の属性を理解し、レイアウトデザインを適用
ブロックとインライン属性の理解と適用
ポジションの理解と応用
アニメーション制作の理解と応用
仮想選択者の理解と適用(:before、:after)
Skip_nav 製作
様々な様々なホバー、フォーカス効果
z-indexの理解と適用
FontAwesomeの使い方と適用
Googleフォントの使い方と適用
開発者ツールの活用法
反応型ウェブページの製作方法と適用
HTMLとCSSだけを知っていても
ウェブページ制作OK!
UI.UXデザイナーやフロントエンド開発者として就職を希望される方は、最近のトレンドに合ったWebページを実装したポートフォリオが少なくとも5~6個は必須です。
本講義はウェブサイト制作シリーズ講義である「本番!ウェブサイト制作Step By Step」のBasic Curseで、ハンファソリューション/ケミカルサイトのメインページをそのまま製作してみる講義です。
「実戦! ウェブサイト制作 Step By Step」 講義シリーズは現在商用化されているウェブサイトの中で、最新トレンドに合わせて審美的な要素に優れ、ポートフォリオ制作に適したウェブサイトを選択してそのまま製作してみる講義で構成されていますので学習にご参考ください。
>> CSS Animation 制作

>>マウスホバー時のスケールが大きくなる - CSS Animation製作

>> 仮想コンテンツを利用してマウスホバー時にスライドされるアニメーション制作

>> PCモードレイアウトからタブレット(1024px、768px)、モバイル解像度(414px、320px)製作

>> PCモードレイアウトからタブレット(1024px、768px)、モバイル解像度(320px)スクロール画面
.gif)
講義はHTMLとCSSの基礎はありますが、レイアウトに対する感が全くない方を対象に実際のWebページをそのまま実装して進行されます。ハンファソリューション/ケミカルサイトのメインページを直接制作してみる過程を通じて、 HTML5とCSS3を活用してレイアウト制作に対する理解を高め、どんなレイアウトを制作しても自信を持って応用して制作できるよう皆様をお手伝いします。
レスポンシブページの制作についての完璧な理解と制作能力の強化はもちろん、優れたクオリティのポートフォリオも持参できるように、次々と一緒に学習しましょう。
Step By Step!
今すぐ始めましょう。
講義が終わったら
得るもの:D
Webページ制作のためには、HTMLとCSSをベースにした、正確なレイアウト作成が最も重要です。 HTMLとCSSの基礎はありますが、 Layout Designについて全く感が来ない方も、基礎から丁寧にお知らせする本講義に誠実に従えば、いつのまにかレイアウト制作のしっかりした基本基盤が固まっていることを感じられるでしょう!
業務生産性を向上させるには、ライブラリとプラグインを使用して、短時間でインタラクティブなウェブサイトを実装できる必要があります。本講義では、ウェブページのレイアウト制作からレスポンシブページの製作まで確実に勉強することができ、実務で必要とするスクリプト、プラグイン、アニメーションなどを利用してウェブページを作成します。講義を聞いて着実に実習してみると、いつのまにか業務能力がUP! UP!
仕事の能力を明らかにし、新しい機会をつかむための効果的な準備の1つは、高品質のポートフォリオです。講義を聞いて実習してみると、自分だけのポートフォリオが積み上げられます。本講義だけでなく、以後のウェブサイト制作実習講義を聞きながら着実にWebページを実装してみると、就職で私の最大の武器になってくれるポートフォリオを完成できるはずです。
よりスムーズな学習のために、J.youngが運営するよくあるウェブディーオープンチャットルームに加入すれば、
ピグマ、UI.UX、コーディング、ポートフォリオ製作関連の核蜂蜜チップと無料ウェビやリンクなどを共有いたします。
- オープンチャットルーム:よく知られたウェブディ
- コード:jyoung
1.ウェブアクセス性をhtml MarkUp-文書構造定義
2. 様々なCSS3の属性を理解し、レイアウトデザインを適用
3.positionの理解と適用
4.BlockとInline属性の理解と適用
5.Animationの理解と適用
6.仮想選択者の理解と適用(:before、:after)
7.様々なhover、focus効果
8 .z-indexの理解と適用
9.skip_nav制作
10.FontAwesomeの使用法と適用
11.Googleフォントを使う
12.開発者ツールの活用法
Q1.就職に役立ちますか?
A1.長文の文章よりも一つのイメージがより強烈に届きます。講義を聞いてウェブページを制作しておけば、人事担当者の目にはっきりとした華やかなポートフォリオを作ることができ、就職に大いに役立つでしょう。
この講義以降、デザイン風とスタイルが異なる
9つのウェブサイト制作講義が順次オープンされます。
ポートフォリオを準備する受講者はこれを参考にして
高品質のウェブページ制作を一緒にしてください。
html, css, html/css, website, ウェブサイト, コーディング
学習対象は
誰でしょう?
HTML / CSSの基礎はありますが、Webページの作成が恐れている人
グラフィックデザイナーがフロント&開発者に転向したい方。
Webデザイナー、パブリッシャーとして就職のために迅速にポートフォリオを制作したい人
Webデザイナー、パブリッシャーとして就職のために様々なレイアウトを設計実装したい方
前提知識、
必要でしょうか?
HTML/CSS
9,034
受講生
366
受講レビュー
227
回答
4.8
講座評価
14
講座
"디자인.개발 포트폴리오 멘토 J.Young입니다."
저는 지난 20년간 웹 디자인 및 앱 개발 회사를 운영하며 현장의 치열함을 몸소 겪어왔습니다. 그 경험을 바탕으로 현재는 대학과 전문 교육 기관에서 UI/UX 디자인부터 프론트엔드 개발까지, 후배 전문가들을 양성하는 데 매진하고 있습니다.
저의 강의 철학은 명확합니다.
기초부터 실무까지 막힘없는 연결
현업이 원하는 핵심 기술의 압축
취업 성공을 부르는 실무형 포트폴리오 완성
어디서부터 시작할지 막막하신 분, 이직을 꿈꾸지만 시간이 부족한 직장인, 그리고 코딩이 남의 이야기처럼 느껴지는 초보자분들까지. 제가 걸어온 20년의 길을 여러분의 지름길로 만들어 드리겠습니다. 당당히 실무자로 서는 그날까지, 여러분의 든든한 사수가 되어 최선을 다해 돕겠습니다.
J.young이 도와드리겠습니다.!!
또한!! 학습하시다 궁금하신 점 있으시면 댓글 남겨주시면
도움이 드릴 수 있는 답을 드리도록 최선을 다하겠습니다.
실무경력
- 2017~현) 웹개발 Director
- 2015년~2017년(주)엘리에셀 총괄 이사
- 2003년~2015년 (주)어뮤징웨어 총괄 이사
- 2003년: 서우씨앤디 디자인실장
- 현)
- UIUX웹기획/ 디자인/프론트엔드 부트캠프 강사 (이젠DX아카데미 -서초점)
- 디자인.개발 포트폴리오 전문 강의 및 그룹 및 개인 지도
* 운영중인 유튜브 (코딩하는 디자이너)
보다 원활한 학습을 위해, J.young이 운영하는 잘난웹디 오픈채팅방에 가입하시면,
강의 질문과 포트폴리오 관련 피드백 드립니다.
- 오픈채팅방명 : 잘난웹디
- 코드 : jyoung
全体
26件 ∙ (4時間 0分)
講座資料(こうぎしりょう):
全体
22件
4.8
22件の受講レビュー
受講レビュー 4
∙
平均評価 4.8
5
AdobeでBracketが初めて出たときに歓声を上げた1人でした^^ エディターはさまざまですが、講師がブラケットで講義してくれて印象的でした。 レスポンシブページを作成しながら、基本的な部分を慎重に教えてくれてありがとう。 タグ理解から開発者ツール活用法まで本当にお得な講座よく聞きました。 周りの知人に強力推薦したい講座、これからもたくさん開設してください。 暑さに疲れないで健康に気をつけてください^^
kateに感謝します。 私の講座大事にして、一生懸命聞いてくれたことをよく知っています。誠にありがとうございます。 私がより良い講義で実力とスキルをアップグレードさせていただけるように 最善の姿勢で準備させていただきます。 次の講座は7月中にオープン予定です。引越しのある関係で発売が遅れて申し訳ありません。もう一度ありがとうございます^^
受講レビュー 6
∙
平均評価 4.3
5
本当に満足な講義でした。 講義で使用するhtmlタグやcss属性はほとんどすべて知っているものです。 コードを打ち、保存し、F5を押すたびに画面が変わることは驚くほど不思議でした。 次の講義も期待され、良い講義を頂きありがとうございます。
受講レビュー 3
∙
平均評価 5.0
5
現在個人事業をしている40代前半の仮装です。今後の第4次産業革命時代に備えて、IT関連技術の核心であるコーディングに関心があり、基礎から身につけ、会社のホームページも直接製作するつもりで検索し、講師の講義を受講することになりました。 HTMLとCSSの基礎だけを知っている状態でしたが、講師様の講義を聞いて実際のウェブページを制作してみると理解が上手くなり、実際の活用法も多く学びました。この講義をきっかけにウェブページ制作に対する自信を得たとても役に立つ講義でした。講師の大方産業講義もまもなく受講予定です。講師の講義で学んだことを基に、素敵な会社のホームページも作り、関連するJavaScript言語も学習し続け、フロントエンターテインメントの開発までしてみようと思います。ありがとうございます。
チョ・ドンチャン 受講評ありがとうございます^^ 今からいくらでもフロントエンドまで 勉強できます~~ 会社のホームページもご存知であれば管理ができるだけ 学びの道!!応援致します!!! 続いて大方産業も受講していただきありがとうございます。 大方産業レイアウトとカラフルなインタラクティブ要素を追加します。 多くの助けになります。 ありがとうございます^^ J.youngドリーム
受講レビュー 2
∙
平均評価 5.0
¥2,789
知識共有者の他の講座を見てみましょう!
同じ分野の他の講座を見てみましょう!