[DAY-077]Bootsrap-表單/影片背景/EMAIL

今天上的是Bootstrap的一些進階套用,只是套用我就只是看一下就好,大多時間還是繼續研究第三題的東西,不過好象有點小感冒,沒有活力一口氣衝刺,每節課做一些做一些,慢慢來。

一頁式的動畫設計

用影象做背景的頁面

e_mail的部份老師說的不完全正確,雖然付費空間和免費空間的寄信功能一定有不同,但能不能寄信的關鍵是在於是否有提供smtp relay的功能,如果沒有開放relay的功能,那就算是付費空間也一樣不能寄信或者是需要提供帳號密碼才能寄信。

無資料庫的訊息回傳

最後老師把影象背景和E_MAIL兩個練習拿來當成作業,並提醒大家要開始打成績了,該補的資料要去補一補了;同時老師也提示大家下周會教joomla的安裝與使用,因為大家下課時圍著老師問這方面的問題,讓老師感受到有這方面的需求,but ,我是覺得使用這些CMS本身並不難,套外掛改版型也不難,難的是商業化的應用,而商業化的部份和程式技術及網頁視覺是沒有直接關係的,CMS我十年前就在玩了,但是要弄出一個可以上線營運的網站還是有困難,宣傳/金流/物流/客服/維運等等問題都比建置網站本身來得複雜多了,當然,那個憨膽要去衝衝看也是值得鼓勵的,痛過才會長得快又壯!

 




[DAY-076]網頁乙級術科第三題帶解之三

今天繼續第三題最麻煩的地方之一,就是首頁的顯示,首頁分別兩大塊,其中海報顯示的部份題目明著就說要做成動畫顯示,還要有自動轉場及選擇轉場的功能,對於JS上得比較少的我們來說,這部份是最吃力的地方了,雖然我是用jQuery來做的,但是搞懂動畫的操作也花了我四五小時的時間才成功。

首頁畫面

接著是院線片清單的部份,這部份的陷阱是CSS,如果要畫面擺得下所有要求的東西,那原始的CSS幾乎一定得改,不然就自己重寫一份新的,如果要將就點做也可以,就是畫面會很不好看就是了,這裏的分頁要求也比較奇特,題目文字寫得比較簡單,但示意圖的分頁很複雜,最後老師說照文字描述說的做出來就夠了。

電影簡介畫面

我自己是把線上訂票的部份先做完一半了,訂票是第三題的麻煩之二,選擇訂票的部份也是擺明了要用js或jQuery來做,我自己研究把資料撈出來再放到script 去當成陣列來使用就花了四五個小時,所幸克服這一關,後面的選位及後台訂票管理就簡單多了。




[DAY-075]網頁乙級術科帶解第三題之二

今天是第三題的第二天,這兩天自己沒什麼在寫程式,進度比較慢,一方面也是在於第三題有很多陷阱,解得讓人森七七,

今天主要是在後台的海報管理和影片管理講完,這邊因為示意圖的畫面和題目的文字描述有出入,所以在解題時要特別留心別被騙了,後台比較麻煩的是排序的功能,老師是用一個起始值做加減的方式來排序,這做法比較簡單,但有些小問題存在,真正考試時,別自己捅自己一刀就還好,我自己最後是採用Jquery的方式來處理,直接在畫面上變更交換順序時,再背景一支程式去更新交換資料的兩筆資料排序值,確保每次的更新每筆資料都有不同的排序值,不過這寫起來有點麻煩,實際考試要用老師的做法還是我自己的做法,我還要再想一下。

海報管理

影片管理的功能沒有什麼麻煩的地方,真要說,就是第三題附的預設CSS我懷疑是for RWD網頁設計的,為了配合題目的要求硬改成1024X768的規格,結果一堆css的屬性都沒設好,直接套用的話整個畫面就亂了,所以第三題花滿多時間在處理CSS的問題.

影片管理

新增影片

 




[DAY-074]UI/UX概念介紹

今天開始講解UI/UX的概念,這是這幾年在APP設計上帶領起來的風潮,雖然具體的應用己在各領域很久了。

UI/UX簡報

老師採用簡報講解的方式,輔助各種實例給大家看,讓大家有進一步的認識。

最後則是進行了一場練習簡報,請各組分析一款軟體或網站的UI/UX設計,並上台報告。

本小組進行的是”台北等公車”的軟體解析

各組上台報告

 




[DAY-073]Illustrator課程完結/乙級術科報考

今天的課程是Illustrator的最後一部份,老師把上周的最後一章關於漸層網格上色的應用教完後就告一段落了,之後說會再上一些UI/UX的部份,我是有點期待的,因為現在實務上也都以UI/UX的設計為主要,軟體的操作己經是基本要求了;

最後一個綜合應用的主題

下午時間是報考乙級術科的作業時間,填寫報名表和繳交相關文件,因為我們全班以團報方式進行,所以有專人來協助處理,繳完錢,就不能回頭了,要考上啊各位!

 




[DAY-072]Bootstrap模版取用與修改

今天老師的重點在於bootstrap的模版取用與修改,老師非常堅持他的做網頁不用寫程式之道,所以幫大家準備了一堆的現成模版供大家使用,然後上課重點就放在如何把別人的模版改成自己要的,今天的主要內容都在如何用刪去法把模版的一部份取出來使用,留下需要的部份,其他的都刪光光;

額外補充關於UEFI的說明

對於還不熟網頁開發的同學來說,這樣的教學內容,的確可以幫助同學快速進入職場,不過對我來說就有點無聊了,所以我一半時間在研究術科的解題上,至於bootstrap的實做,我則是打算自己找教材來研究就好。

 




[DAY-071]網頁乙級術科第二題帶四及第三題一

上午請半天假去申請減免報名費的相關證明,順便睡飽點.

下午進教室時,老師正在講解問卷調查的部份,剩最後的統計結果查看的部份;

新增問卷後台

登入者可以進行投票

問卷調查的結果頁面

接著就是開始第三題的講解,第三題也是陷阱一堆的題目,加上CSS版本已經和題目所展示的落差頗大,做起來有點綁手綁腳的,但就難度來說,因為已經做了很多的刪減的,所以主要的功能就只有轉場動畫的製作及訂票系統而已;這邊老師有提到,先前有講過的功能會希望當成作業大家自己回家做,課堂的時間儘量用來針對沒說過的內容進行詳細的說明.

第三題從管理系統開始做

預告片海報管理後台




[DAY-070]網頁乙級術科第二題帶解三

今天繼續第二題的解題練習,第二題比較麻煩的地方在於文章的按讚部份,有點難度的可能是問卷調查的部份,其它的則只是花時間,尤其是在css的調整上,除了多練習,也沒有什麼別的方法了.

帳號管理的畫面

文章管理的畫面

人氣文章的畫面

我自己則是開始解第三題,第三題麻煩的地方除了題目的一些描述不是很清楚之外,再者就是版型檔案附的css和題目提供的示意思有滿大的落差,需要花點時間做調整,不然做出來的效果不只和題目不太一樣,自己看了也覺得礙眼,第三題完全沒有附js的檔案,但卻要求要做slide show 的轉場動畫,這部份看來只能硬記起來了,因為考試現場不能連網,無法查詢動畫效果及指令.




[DAT-069]文字應用/填色技巧/圖表/描圖/網格上色

今天一口氣上了不少內容,大多都是先前提過的一些比較零碎的功能,透過實作來加以應用,照老師的說法,再兩天的課應該就上完Illustartor的課了,之後就會把時間放在練習程式或一些數位媒體的補充知識上,目前班上大概有十來位同學確定會考乙級證照,希望大家都能有好成績。

網格上色工具

描圖及即時上色的應用

圖表的應用

快速填色,置換顏色的技巧

文字應用




[DAY-068]Illustrator 紙袋設計/3D工具

今天教紙袋設計及3D工具,感覺Illustrator到後面就是練習各種實例,功能上差不多就是先前教過的基本工具的排列組合.

紙袋設計,要注意紙袋各邊的關係來放置相關的內容

3D工具及貼圖

利用3D工具製作電池




[DAY-067]Bootstrap 介紹/實習

今天開始講解Bootstrap,老師說他預計花六周時間來講解,包含各種常用的bootstrap案例練習,不過今天講的東西大多是之前就多少有提到的就是.

bootsrtap官網

網格系統

快速版型線上工具

在dw中實做bootstrap




試題釋疑作業

因為第二題的題目有各種問題,所以今天特別上網查了一下要如何反應問題,查到檢定作業規則的條文中,大意是說,要考試當下或考完後才能提出,然後再由原命題人員做出回應,是說我覺得這網頁乙級看起來也沒太多人考,然後題目五年來也沒什麼改變,題目中的錯目也存在五年了,五年來都沒人反應問題是很有趣的一件事,這表示這些題目上的錯誤並沒有造成實質測試時的問題,所以就沒有改了,比如第二題中最新文章中的畫面示意圖和後來要按讚的示意圖,明顯是不同的布局,一個是用table一個是用div,但卻放在同一個動作要求中,這是要如何作答?

同一題目卻有兩種不同的示意圖

查了條文的解釋令人沮喪,看來只能當成這五分送給監測老師,然後等考完再申請疑義,不然後面要考的人會無所適從