動畫互動網頁程式入門 (HTML/CSS/JS)
找相似
$2,000

動畫互動網頁程式入門 (HTML/CSS/JS)

Hahow 好學校－線上課程平台
搶購
訂單成立賺3%
下單享LINE POINTS點數
訂單成立賺3% 60 點
價格趨勢怎麼看？
設定到價通知
分類：
旅遊餐券 娛樂/生活/服務券 服務課程票券
Hahow 好學校－線上課程平台

Hahow 好學校－線上課程平台

【 消費提醒 】 1. 需透過 LINE 購物前往 Hahow 好學校官方網站消費，並在同一瀏覽器於 24 小時內結帳，方享有 LINE POINTS 回饋資格。 2. 唯有「精選課程」（https://hahow.in/apselect-event）符合回饋資格，在此頁面外的課程或任何學習補給與優惠商品合購組合皆不符合 LINE POINTS 回饋資格，可以於 LINE 購物商店直接搜尋課程名稱，確認是否符合回饋，自行連結至他處所購買之課程將不會回饋 LINE POINTS 點數。 3. 建議從 LINE 購物進入 Hahow 站上後，挑選課程加入購物車並直接完成結帳與付款流程，中間請勿跳出 Hahow 網站，以確保回饋資格。 4. 點數回饋上限以單筆訂單計算。 5. 取消訂單或退貨行為，不具贈點資格。 6. 點數將於付費並無退貨後 30 天前後發送， 是否符合回饋資格請洽 LINE購物客服詢問。

相關文章

清洗保溫瓶好重要！保溫瓶清洗方法與超高CP保溫瓶推薦

清洗保溫瓶好重要！保溫瓶清洗方法與超高CP保溫瓶推薦

保溫杯的好，你不能不知道！夏天裝冰飲能保冰、冬天裝熱飲能保溫，方便好用又討人喜歡，而許多人會用使用同個保溫瓶裝不同類型的飲...
50,153人已觀看
復古跑鞋57/40花樣上市，春櫻粉、梨花奶茶、雛菊黃...5款春日限定錯過捶心肝！

復古跑鞋57/40花樣上市，春櫻粉、梨花奶茶、雛菊黃...5款春日限定錯過捶心肝！

靠著舒適度和有型有款的設計New Balance 57/40 復古運動鞋，成為近期女鞋頭們熱搜大熱門！搶眼復古風格搭配上醒...
56,986人已觀看
咖啡因洗髮精好用嗎？網友大推5款咖啡因洗髮精

咖啡因洗髮精好用嗎？網友大推5款咖啡因洗髮精

想要提神，來杯咖啡準沒錯！不過把咖啡因添加在洗髮精中，你用過了嗎？咖啡因被認為能滋養頭皮及頭髮並強化髮根，而被廣泛使用於洗...
33,715人已觀看
開箱台灣三大航空飛機餐：「長榮」聯名燒肉大王乾杯、「華航」則有米其林三星頤宮加持！

開箱台灣三大航空飛機餐：「長榮」聯名燒肉大王乾杯、「華航」則有米其林三星頤宮加持！

「飛機餐」給你枯燥乏味，可有可無的老印象嗎？台灣三大航空正悄悄開打機上美食大戰！「星宇航空」頭等艙、商務艙與米其林星級主廚...
869人已觀看
你真的知道自己的「性向」嗎？超狂測驗直接徹底了解自我

你真的知道自己的「性向」嗎？超狂測驗直接徹底了解自我

相較於以前社會風氣保守的年代，現在的同性／雙性戀者發現自己的真正性向都較敢坦然表現，但還是有少數人無法正視內心，有的人甚至...
65,475人已觀看
藍瓶咖啡＋芬蘭印花！Blue Bottle Coffee 與 Marimekko 推出聯名：限定商品、開賣時間一次看

藍瓶咖啡＋芬蘭印花！Blue Bottle Coffee 與 Marimekko 推出聯名：限定商品、開賣時間一次看

來自芬蘭的國民品牌 Marimekko，憑著標誌性的印花與繽紛色彩，在全球形塑鮮明的市場定位，從服裝、家飾，再到日常用品，...
9,915人已觀看
【Bella出國去】第一次搭遊輪該注意什麼？10個「太陽公主號」Q&A解答，5家限定美食推薦！

【Bella出國去】第一次搭遊輪該注意什麼？10個「太陽公主號」Q&A解答，5家限定美食推薦！

想來一回人生第一次的頂級遊輪旅遊嗎？公主遊輪旗下超過10艘不同型號遊輪，每艘主打不同項目，你能在公主找到最符合你的一艘！若...
62人已觀看
日韓暢銷6款人氣即溶咖啡！連明星們都愛不釋口！

日韓暢銷6款人氣即溶咖啡！連明星們都愛不釋口！

咖啡可說是每日精神糧食，宅家辦公一樣少不了它！尤其即溶咖啡既省時又方便，就連2021最夯的韓國影集「黑道律師文森佐」都看得...
517,031人已觀看
水晶寶寶哪裡買到正確丟棄處理方式｜懶人包

水晶寶寶哪裡買到正確丟棄處理方式｜懶人包

水晶寶寶是什麼？是活得還死的？ 水晶寶寶是沒有生命的非生物，水晶寶寶的成分屬於丙烯酸高分子聚合物，這種化學藥品具有強力吸水...
74,059人已觀看
鞋控必入手復古跑鞋，推薦8款舒適又百搭！

鞋控必入手復古跑鞋，推薦8款舒適又百搭！

復古跑鞋風潮再度崛起，你跟上了嗎？近年運動跑鞋已成為穿搭必備單品之一，「復古跑鞋」在外表設計中加入復古潮流元素，不只富有古...
73,280人已觀看

相似商品

動畫互動網頁特效入門（JS/CANVAS）
找相似
2,500

動畫互動網頁特效入門（JS/CANVAS）

Hahow 好學校－線上課程平台
3%
Streamlit x ChatGPT 快速打造資料分析網頁
找相似
2,888

Streamlit x ChatGPT 快速打造資料分析網頁

Hahow 好學校－線上課程平台
3%
Python 資料分析 - 網頁爬蟲與視覺呈現
找相似
1,880

Python 資料分析 - 網頁爬蟲與視覺呈現

Hahow 好學校－線上課程平台
3%
Procreate人體繪畫入門－扎實基礎養成
找相似
3,600

Procreate人體繪畫入門－扎實基礎養成

Hahow 好學校－線上課程平台
3%
Python 爬蟲入門特訓 ─ 資料抓取與處理應用
找相似
1,880

Python 爬蟲入門特訓 ─ 資料抓取與處理應用

Hahow 好學校－線上課程平台
3%
DBA 訓練營 - SQL Server 資料庫管理入門
找相似
2,600

DBA 訓練營 - SQL Server 資料庫管理入門

Hahow 好學校－線上課程平台
3%
零基礎轉職！網頁設計 HTML、CSS 快速入門
找相似
2,690

零基礎轉職！網頁設計 HTML、CSS 快速入門

Hahow 好學校－線上課程平台
3%
18 單元從零上手！百萬 TikToker 短影音入門課
找相似
1,699

18 單元從零上手！百萬 TikToker 短影音入門課

Hahow 好學校－線上課程平台
3%
24 單元入門投資科學 一次搞懂投資必備知識
找相似
3,600

24 單元入門投資科學 一次搞懂投資必備知識

Hahow 好學校－線上課程平台
3%
使用 jQuery 打造互動性網頁動畫效果
找相似
1,600

使用 jQuery 打造互動性網頁動畫效果

Hahow 好學校－線上課程平台
3%
【書寶二手書T1／進修考試_FLJ】一般行政焦點速成_5本合售_國文測驗_公民等……_尚榜、高朋等
找相似
9折
1,499

【書寶二手書T1／進修考試_FLJ】一般行政焦點速成_5本合售_國文測驗_公民等……_尚榜、高朋等

台灣樂天市場
1%
Procreate 插畫入門－從素描到風格
找相似
2,800

Procreate 插畫入門－從素描到風格

Hahow 好學校－線上課程平台
3%
Docker 部署入門完全指南-圖片速學攻略
找相似
1,399

Docker 部署入門完全指南-圖片速學攻略

Hahow 好學校－線上課程平台
3%
Blender 從零開始：打造黏土手感停格動畫
找相似
3,500

Blender 從零開始：打造黏土手感停格動畫

Hahow 好學校－線上課程平台
3%

熱銷排行榜

更多

找回身體最佳狀態｜動力鏈：人人必修的身體使用說明書
找相似
11,000

找回身體最佳狀態｜動力鏈：人人必修的身體使用說明書

Hahow 好學校－線上課程平台
3%
讓插畫走入生活－Procreate 文創物實作！
找相似
2,880

讓插畫走入生活－Procreate 文創物實作！

Hahow 好學校－線上課程平台
3%
【限時招募，6/30截止】2024 My Reading Box 幼小銜接閱讀計畫 | 小一新生安心懶人包（每月2書+線上課程，共12個月），好評加碼下單贈【注音符號凹槽筆順練習本】。分期0利率，每月最低799元
找相似
6折
4,799

【限時招募，6/30截止】2024 My Reading Box 幼小銜接閱讀計畫 | 小一新生安心懶人包（每月2書+線上課程，共12個月），好評加碼下單贈【注音符號凹槽筆順練習本】。分期0利率，每月最低799元

親子天下Shopping
2%
跟著韓娛學韓文！發音到初級文法一次掌握
找相似
2,500

跟著韓娛學韓文！發音到初級文法一次掌握

Hahow 好學校－線上課程平台
3%
王梓沅的 3D 英文筆記術：打造最強「說」「寫」英語資料庫
找相似
2,800

王梓沅的 3D 英文筆記術：打造最強「說」「寫」英語資料庫

Hahow 好學校－線上課程平台
3%
Notion 實戰課程：打造專屬數位工作術
找相似
3,380

Notion 實戰課程：打造專屬數位工作術

Hahow 好學校－線上課程平台
3%
社群力：30 堂課突破你的內容行銷盲點！
找相似
2,400

社群力：30 堂課突破你的內容行銷盲點！

Hahow 好學校－線上課程平台
3%
iPad 上的小小故事：Procreate 童書繪本插畫課
找相似
2,500

iPad 上的小小故事：Procreate 童書繪本插畫課

Hahow 好學校－線上課程平台
3%
Python 入門特訓 - 基礎實作到證照攻略
找相似
1,790

Python 入門特訓 - 基礎實作到證照攻略

Hahow 好學校－線上課程平台
3%
Photoshop 合成必修 - 電影光影場景合成
找相似
4,180

Photoshop 合成必修 - 電影光影場景合成

Hahow 好學校－線上課程平台
3%
AI 繪圖溝通術：搭上 AI 藝術的魔法列車
找相似
2,399

AI 繪圖溝通術：搭上 AI 藝術的魔法列車

Hahow 好學校－線上課程平台
3%
省錢攝影術：零基礎拍好美食＆商品！
找相似
1,890

省錢攝影術：零基礎拍好美食＆商品！

Hahow 好學校－線上課程平台
3%
擺脫職涯卡關！聚焦你的職場絕對優勢
找相似
2,980

擺脫職涯卡關！聚焦你的職場絕對優勢

Hahow 好學校－線上課程平台
3%
直球對決你的工作焦慮！劉軒的 50 堂職場心理學
找相似
8,000

直球對決你的工作焦慮！劉軒的 50 堂職場心理學

Hahow 好學校－線上課程平台
3%
動畫互動網頁程式入門 (HTML/CSS/JS)
找相似
2,000

動畫互動網頁程式入門 (HTML/CSS/JS)

Hahow 好學校－線上課程平台
3%
Canva 入門到進階實戰｜零基礎做質感設計
找相似
2,780

Canva 入門到進階實戰｜零基礎做質感設計

Hahow 好學校－線上課程平台
3%
王梓沅的高效英聽學習法：3 階段打造英聽腦
找相似
3,800

王梓沅的高效英聽學習法：3 階段打造英聽腦

Hahow 好學校－線上課程平台
3%
戰爭來了怎麼辦？黑熊學院民防基礎線上課
找相似
2,300

戰爭來了怎麼辦？黑熊學院民防基礎線上課

Hahow 好學校－線上課程平台
3%
掌握鉤針編織邏輯：五種針法自造生活小物
找相似
2,980

掌握鉤針編織邏輯：五種針法自造生活小物

Hahow 好學校－線上課程平台
3%
林思翰的 AIGC 工作流：聚焦核心問題，打造創意實戰力
找相似
9,500

林思翰的 AIGC 工作流：聚焦核心問題，打造創意實戰力

Hahow 好學校－線上課程平台
3%
在台灣也能學一口漂亮英文！Phonics 自然發音&正音教學
找相似
1,200

在台灣也能學一口漂亮英文！Phonics 自然發音&正音教學

Hahow 好學校－線上課程平台
3%
AI 時代人人必學：用 ChatGPT 全面升級你的工作流程
找相似
3,280

AI 時代人人必學：用 ChatGPT 全面升級你的工作流程

Hahow 好學校－線上課程平台
3%
【預購】王毅企業管理總複習-超值毅攻略(線上課程＋書)(共1本)(王毅)-1SE01(書號：0010IE1042405)
找相似
69折
2,188

【預購】王毅企業管理總複習-超值毅攻略(線上課程＋書)(共1本)(王毅)-1SE01(書號：0010IE1042405)

新保成網路書局
4%
融入美國口說日常！和莫彩曦學英文慣用語
找相似
1,700

融入美國口說日常！和莫彩曦學英文慣用語

Hahow 好學校－線上課程平台
3%
【Cyberlink 訊連科技】威力導演365 1年訂閱制方案 全方位360º影片創作軟體 專業影音剪輯
找相似
1,782

【Cyberlink 訊連科技】威力導演365 1年訂閱制方案 全方位360º影片創作軟體 專業影音剪輯

PChome 24h購物
1%
Github 免費架站術！輕鬆打造個人品牌
找相似
890

Github 免費架站術！輕鬆打造個人品牌

Hahow 好學校－線上課程平台
3%
打動人心的創作秘密，畫出個性的角色設計
找相似
1,280

打動人心的創作秘密，畫出個性的角色設計

Hahow 好學校－線上課程平台
3%
伴侶理財必修課｜談錢不傷感情 打造神隊友
找相似
2,980

伴侶理財必修課｜談錢不傷感情 打造神隊友

Hahow 好學校－線上課程平台
3%
一次搞懂專案管理 - 從入門到業界實務
找相似
2,200

一次搞懂專案管理 - 從入門到業界實務

Hahow 好學校－線上課程平台
3%
Node.js、MongoDB 網站後端工程入門
找相似
3,200

Node.js、MongoDB 網站後端工程入門

Hahow 好學校－線上課程平台
3%

商品描述

你曾經想學過網頁設計嗎?曾經看過線上課程，大部分的程式設計教學往往只講解功能沒教你如何讓網頁好看，好用學完做出來之後，總離真正上線的網頁有段距離而覺得沮喪寫一個網頁，往往不只是一個人的夢魘，設計師拉好了頁面交給工程師，卻怎麼樣也達不到想要的效果，而程式設計師也溝通的煩悶，改到不耐煩的說「要不然你來做阿」設計師能做的話，他早就自己做了，但上網一查語法html/js/css五花撩亂，我們早已脫離了無名小站修改網誌語法的美好時代，究竟該怎麼無痛入手網頁程式開發呢?「目前突破8000%!超過4000人一同學習」課程更新>1/26新增課程共筆共筆連結包含學習目錄與推薦時間/課程勘誤補充/推薦書籍（持續新增）可以一起編輯>1/17全部單元上線完畢>11/24更新課程預計上線時間>11/7新增即時作品集合系統已經超過一百件同學繳交作品與練習(至11/15之前已上線85單元共1230分鐘)>9/04新增FB討論社群動畫互動網頁程式入門課程討論社團>8/23詳細版課程綱要：課程綱要連結>7/4課程募資期間圓滿結束！！一目了然的教學環境這堂課會告訴你從網站的草稿跟結構開始，要怎麼規劃才能有組織，不會掛再螢幕前不知道要做什麼，會從設計師的角度看，去操作網頁，一切你會在以拉上面看到的美好事物，我們會網頁的程式語言呈現。不同於一般的網頁設計入門，以最好用，最簡便的平台--Codepen代替教學，學習中再也不用上下傳檔案預覽，也能即時看到更新的效果，以替代性的jade/sass樣版語言，能簡化大量HTML/CSS的繁瑣，讓程式易讀好懂，當然後續也會在額外教大家怎麼正式的架設自己的網站。這一切讓初期學習不會因為一點點打錯，網頁出不來而搥桌，跟著這堂課從零到一，就能入門網頁開發了!最後常見的問題是，結束了一個課程的同時，很多人遇到不會的問題就卡死，怎麼做也只做得出範例的幾個網頁，因此，特別規劃了「搜尋與問題解決技巧」，讓你以後不管遇到什麼都能靠自己的力量去解決!不論你是設計師、學生、程式設計師，一般想碰網頁設計的人，這堂課會準備好一切你需要的素材，讓你感受最少的阻力入門，即使你不懂設計，也能跟著做出來，且知道以後需要什麼樣的素材製作網頁「只有自學者才懂自學的痛」三年前接觸網頁程式設計，沒有經驗的我，接了一個國中網頁設計的案子，上個經歷還停留在會動的會跳的五顏六色Flash美好年代，只好搜尋線上各種網頁設計相關教學，卻都是一坨坨程式碼教你如何打H1到H4標題（還會由大到小好棒棒），CSS可愛的背景跟文字家族。打開記事本想要刻簡單的一個導覽列跟放張圖片，卻怎麼樣都調不到自己想要的位置，改了一整天，好不容易對齊了，螢幕大小一改變半個頁面就不見。我知道，這些慘痛經歷，我都經歷過，一直都是用繪圖軟體過來，設計的頁面平平都是軟體，為什麼網站方面的教學通病都停留在語法跟瑣碎的功能，總是沒人教怎麼把腦海中的頁面變成現實，讓設計的版面照著想像的運作。課程目標這堂課會告訴你從網站的草稿跟結構開始，要怎麼規劃才能有組織，不會掛在螢幕前不知道要做什麼這次的課程，著重在製作網頁的時候，究竟要怎麼把網站做『好』而不是單純的寫出來，卻不能看不好用不夠理想。從illustrator的思維來看：如何讓東西對齊彼此、至中排列到正確的位置如何調整每個東西的顏色、粗細、透明度與看起來的樣子如何讓文字脫離新細明體魔掌、行距、字距、讓文章看起來舒服如何做到裁切版面、遮罩、繪圖、框線，在網頁上實踐各種圖像設計的常用技巧如何讓東西有趣的跟滑鼠互動，使網頁變得好玩在素材的方面，會準備好可能用到的圖，以及各種幫助學習的工具，帶著完整走一次網站開發的流程，所以課程結束後，不會徬徨無助只能照著做範例，而是能一步一步自己找資源與參考資料，將夢想的網站與動畫實現。你也許會想說，我套模板就好啦，為什麼要學網頁設計呢?套模板是一種選擇，不過學完了這堂課，你也將會有自己的能力改造模板、看懂他們，更能有系統的規劃、或與他人合作，了解以技術觀點來看網頁能做到什麼讓你能夠快速上手一些網站視覺處理的撇步，享受做出屬於自己獨一無二網頁的成就感。課程中你將能做出1.從頭開始規畫一個網頁的結構、內容與呈現方式2.章節三、基礎html/css簡單的自我介紹頁面，練習網頁元素操縱、對位與外觀3.章節四、系統化管理網頁設計-sass變數化易於更改配色/樣式的網頁模板4.學習網站配色與視覺的基礎概念，實作icon匯出4.製作動態互動天氣盒子5.使用Bootstrap+Skrollr製作捲動式專題網頁6.練習如何從概念、發想到利用網格系統分析與繪製草稿5.學習分析並刻一個模仿Hahow募資頁面板型的網頁5.走過網頁框架、配色、佈局到平面稿的流程6.使用Vue.js練習資料性的網頁與製作一台互動鋼琴7.練習各種滑鼠互動與基礎動畫課程單元總覽2-楔子-課程進行模式說明3-楔子-網頁前後端如何運作4-基礎前期規劃-網站專案開發流程5-基礎前期規劃-網站主題名稱logo6-基礎前期規劃-網站瀏覽結構樹規劃7-基礎前期規劃-網站排版規劃與分類8-基礎前期規劃-網站視覺配色概念與資源9-本機環境架設-sublime操作與瀏覽器預覽網頁10-本機環境架設-伺服器瀏覽與原理講解11-Codepen環境架設-平台介紹/註冊與基礎設定12-Codepen環境架設-實際使用sublime中快速鍵13-基礎HTML/CSS-html中元素&排列的概念14-基礎HTML/CSS-html中結構&層級的概念15-基礎HTML/CSS-簡易版本自我介紹16-基礎HTML/CSS-css直接調整外觀與顏色框線17-基礎HTML/CSS-css分開撰寫-class&id概念18-基礎HTML/CSS-css顯示方式displayblock/inline19-基礎HTML/CSS-css元素位置-相對/絕對定位20-基礎HTML/CSS-css內間隔/外間隔(padding/margin)21-基礎HTML/CSS-css字體變化與span-在文章段落中製作變化22-基礎HTML/CSS-html/css大整合-製作獨特名片網頁23-​基礎HTML/CSS-功課說明-製作自己的技能網頁24-系統性管理開發-html縮寫模組-Emmet介紹25-系統性管理開發-html樣板語言-jade(pug)(課程主要使用)26-系統性管理開發-css樣板語言-sass(課程主要使用)27-系統性管理開發-sass-變數概念管理色彩&內容28-系統性管理開發-sass-動態產生模組mixin概念29-系統性管理開發-sass-常用mixin與累積資源30-系統性管理開發-html參考資料轉換jade31-系統性管理開發-實作網頁品牌視覺指導套色32-素材前期準備-如何在以拉中製作icon/圖像33-素材前期準備-如何輸出圖片jpeg/png/svg34-素材前期準備-將圖片上傳到imgur影像網站35-素材前期準備-管理網頁色彩(guideline/sass/js)36-前端基礎動畫互動-htmlattr與自定義屬性名稱37-前端基礎動畫互動-css綜合定位運用absolute/relative38-前端基礎動畫互動-css加入基礎滑鼠互動:hover/:active39-前端基礎動畫互動-css動畫基礎transition-duration/delay40-前端基礎動畫互動-css製作影格動畫animation/keyframes41-前端基礎動畫互動-css動畫速度曲線fillmode/speedcurve42-前端基礎動畫互動-SVG-繪製向量網頁圖片/logo43-前端基礎動畫互動-SVG-讓你的LOGO或圖像動起來44-前端基礎動畫互動-動態互動天氣盒子45-前端進階程式js-引言46-前端進階程式js-jquery動態改變css外觀/html內容47-前端進階程式js-jquery初階滑鼠事件-click/hover48-前端進階程式js-jquery變數概念-儲存修改與判斷49-前端進階程式js-json物件陣列概念&for遍歷50-前端進階程式js-Jquery切換class/css應用-手機demo51-前端進階程式js-jquery/json動態產生購物車清單52-前端進階程式js-Jqueryajax-非同步載入與應用介紹53-前端進階程式js-Jqueryajax-實作導入資料代辦清單54-前端進階程式js-實作購物車-動態新增購買物品與結算55-RWD原理與應用-內容流與概念說明56-RWD原理與應用-指定比例尺寸%與max-width/min-width57-RWD原理與應用-重新排版的原理-特定條件css-mediaquery58-RWD原理與應用-實作手機版面-模仿fb帳號頁面桌面/手機板變化59-RWD原理與應用-懶人工具-bootstrap原理與結構講解60-RWD原理與應用-bootstrap基礎案例與原理熟悉61-RWD原理與應用-bootstrap格線系統原理與RWD應用62-RWD原理與應用-bootstrap應用技巧padding型規劃63-實際應用範例bootstrap-結合skrollr製作捲動式網頁64-網頁視覺設計-概念-版面規劃概念與網格系統(AI/SKETCH/紙筆)65-網頁視覺設計-概念-與頁面結構/跳轉方式規劃66-網頁視覺設計-概念-樣式顏色規劃67-網頁視覺設計-概念-微互動元素動畫反應規劃68-網頁視覺設計-案例-從元素建構而上的設計69-網頁視覺設計-案例-從頁面整體切分而下的設計70-網頁視覺設計-案例-從設計轉換程式網頁的常用技巧71-實際網站應用案例-YellowStudio設計工作室網頁72-前端框架Vue.js-為什麼要用資料導向做網頁(回顧js)73-前端框架Vue.js-將變數代入模板中74-前端框架Vue.js-v-for列舉元素應用75-前端框架Vue.js-v-model使用者輸入雙向綁定76-前端框架Vue.js-v-if/v-show條件渲染與資料的後處理-實作博客來77-前端框架Vue.js-v-on/method建立js事件78-前端框架Vue.js-與AJAX的對接動態載入資訊79-前端框架Vue.js-綜合案例-使用hahow課程資料80-前端框架Vue.js-互動錄音播放鋼琴81-購買伺服器部署/網域-如何匯出codepen與網站結構82-購買伺服器部署/網域-現成主機與網址DNS設置83-購買伺服器部署/網域-linux主機設置與安裝apache84-購買伺服器部署/網域-使用filezilla軟體連線與上傳85-購買伺服器部署/網域-使用sublimesftp進行同步86-購買伺服器部署/網域-使用Prepros在電腦上動態編譯sass/jade87-購買伺服器部署/網域-網站上線GA追蹤與og(用在fb)顯示設定88-破除障礙-問題解決的技巧-ChromeDevtools89-後續發展與介紹-如何規劃自己的未來學習路程(前端/動畫)同學們的作品集作品集連結：http://2017.awiclass.monoame.com/proj/1?utm=class_1_description網站範例參考:臺北聲音地景計畫-「捷運站體環境音樂」徵選活動花旗聯合勸募2016複雜生活節DyverseStudio音樂工作室(舊)翔虹AutoCAD技術中心MonoameDesign墨雨設計新詩視覺化靠北交大2.0Abstract(將音樂轉成視覺形式)常見問題Q&A(6/24更新)沒有程式或設計基礎適合上這門課嗎?A:這堂課是為了讓設計相關或是沒有任何程式基礎的人，能上手真正“業界”網頁程式設計的課程!，其實在業界的大型網站往往都不是用軟體，而是用程式碼一行一行刻出來的，沒有圖形化介面也不容易親近，簡介中提到的codepen平台是線上的編輯環境，可以即時預覽打出來的程式，不會覺得學起來很抽象，也可以省去上傳檔案才能預覽的麻煩:)，而且平台練習使用都是免費的！開啟網頁瀏覽器輸入網址就可以使用希望能幫助大家不害怕程式設計，懂得如何熟練跟用它操作網頁視覺互動，能做的東西絕對比單純用dreamweaver排版來的多而且專業，在業界也可以提升跟相關程式人員的溝通基礎唷!AdobeIllstrator/網頁開發的課程比例各占多少呢?不會以拉適合學嗎?A:可以的，主要的內容會放在網頁編輯開發上，以拉是輔助工具而已出場機會不多，課程中的範例都會準備好素材給各位練習唷!在後半課程我會提到多ㄧ些圖像設計跟介面的概念，與ㄧ些比較有趣的應用手法和案例，AI不是這次課程的主體，僅會拿來做版面的規劃跟視覺，不過還是會提到基礎的使用喔!如果沒有以拉，也可以用任何繪圖軟體、甚至紙筆做規劃都可以!重點是如何有系統的規劃結構跟版面。RWD(響應式網頁)會講到嗎?A:在課堂中會教學RWD是什麼，如何基礎的判斷裝置寬度改變對應的CSS，當了解基礎部分後，會進一步引入框架等RWD常用模組，希望讓大家不只會使用這些套件，更能了解背後運作的原理，才能夠能改能修，對於網頁有更高的操控度不會像拼裝車搖搖晃晃。課程使用的軟體要怎麼安裝跟使用呢?有分平台嗎?A:簡介中提到的codepen平台是線上的編輯環境，網址為http://www.codepen.io，可以即時預覽打出來的程式，開啟網頁瀏覽器輸入網址就可以使用!不論是MAC或是Windows都可以使用已經是html/css工程師了，適合上這門課嗎?A:這門課大約50%入門，50%是專攻介面設計跟動畫呈現，希望能夠快速抓住網頁美感跟互動規劃的工程師，十分適合來上這門課!常用的參考資料/學習資源有什麼呢?視覺部分，像是Pinterest/Dribble還有這次的教學平台Codepen，關於視覺介面只要搜尋關鍵字UI/UXWebDesign就可以找到很多不錯的案例!程式部分w3school在基礎的html/css都有方便的索引參考，想做什麼就查什麼，雖然偏向功能解析，只要掌握網頁基本概念了之後都能夠很快速的引用。可以分享相關接案經歷跟流程細節嗎?A:會特別有一個單元是針對自己的接案經驗做分享，如果大家有特別感興趣的部分都可以反應在平台上再安排內容:)圖文內容的排版跟結構規劃會提到嗎?A:會分析3-4個基本的網站案例，以及常見的網頁呈現形式，UI/UX部分有很多瑣碎的細節和視覺要安排，都會逐步分析與帶大家實際模仿大型頁面的思維做練習，累積能量創造自己的作品!上完這門課之後，有辦法獨立接案嗎?A:獨立接案需要經驗累積，不過把課程上提的東西練熟跟自己嘗試應用，能讓你熟悉網頁領域不害怕，容易與工程師合作，自行進修便能嘗試接案。能透過這門課做出購物車真正能結帳、或是社團的留言功能嗎?A:這堂課主要是針對前端跟介面，所以後端並沒有提到，但是能對網站有很完整的了解，也能自行上手其他技術，後端部分又是另一門學問，不是那麼快可以學到完成深入的東西了！想學更進階的JS跟繪圖嗎？第二堂課-動態互動網頁特效入門這堂課將帶領你，從零開始打造一個「打動人心」的互動特效網頁；賦予你堅實的網頁開發技術、靈活組合各式技巧的應變能力，透過從零開始的JS程式教學與Canvas繪圖概念，結合數學、物理與物件導向程式開發，幫助你實踐心中的想法。課程內容分為四階段，總共2000分鐘以上第一階段：將HTML/CSS融會貫通，輕鬆入門，順暢進階第二階段：JavaScript程式與動畫基礎，做出設計感的動畫應用第三階段：UI原理實作與Canvas運算藝術第四階段：結合Vue.js，打造輕巧完整的獨立網頁遊戲熱騰騰上線中課程連結個人經歷墨雨設計創辦人吳哲宇從動畫與平面設計起家，持續做到整體品牌形象CI設計到UI/UXAPP介面設計，目前專攻網頁動畫與互動，研究如何以網頁的技巧實踐MotionGraphics的精神，以設計的角度主宰網頁，讓網頁不只是能用、資訊呈現，更要有趣、好玩。第五屆宏碁數位創作獎國中組首獎第六屆宏碁數位創作獎國中組首獎第七屆宏碁數位創作獎高中普通組首獎+評審團超級大獎第八屆宏碁數位創作獎高中普通組優等第九屆宏碁數位創作獎高中專業組首獎+評審團超級大獎故事旅社啟程，故事總匯風視覺設計台北智慧城市黑客松評審團超級大獎Selinko&RemyMartin限量合作酒款APP界面設計聯合報國際美容展2015/2016前後台網頁暨系統開發2015世界健康大會前後台網頁暨系統開發翔虹AutoCAD技術中心網頁與管理系統開發其他作品

加入購物車

設定到價通知

前往賣場3%