作者sakuraakira (淡月光)
看板Web_Design
標題[心得] 我想分享完成網站的喜悅
時間Sat Mar 30 07:12:46 2013
我並不是資工系畢業的~ 是日文系。
畢業前只學到少數 HTML寫法, 知道要<html>然後<head>接著<title>
最後在<body>寫入內容。
早期接觸的程式是C++,當初是為了編寫線上遊戲外掛,花了2個月苦讀C++。
後來要把寫好外掛分享給朋友開始用免費網頁空間,放上HTML提供下載。
然後研究HTML的一些效果,才開始喜歡上網頁設計。
以上是說明我不是基礎很好的網頁設計人員。
我網站是用Silverlight寫出來的,不知道在這分享心得合不合適。
反正就先PO,不行最多砍文!是有Silverlight版,但一個月來看都0人氣,我都哭了。
介紹網站:
一個讓會員自由分享音樂的網站,可以上傳歌曲,設計自己歌本,歌本可以放桌面
播放清單會自動記錄歌曲及播放進度,桌面歌本也會自動記錄位置。目地是讓使用者用
起來像安裝在電腦的播放器一樣。
擷取內容影像 :
http://slplayer.net/logs/good.jpg
http://slplayer.net/logs/good2.jpg
網址:
http://slplayer.net/
網站製作流程:
1.構想網站及租用空間:
參考各種程式介面的呈現方式及滑鼠鍵盤輸入處理,加入自己的想法。
找尋網站空間的擬虛主機代理商。
使用工具:自動鉛筆 + 空白筆記本(寫草稿) & E-Mail (聯絡代理商)
使用語言:中文夾帶英文又有日文
花費時間:1星期左右
2.設計資料庫:
把需要的資料,會員資料及歌曲資料及檔案址位等等做規劃,
編寫PHP建立MySQL資料表。
使用工具: PHPDesigner 7(編寫php及sql指令) & PHPMyAdmin 3.5(瀏覽成果)
使用語言: PHP & SQL
花費時間:約2天
3.設計介面:
編寫呈現的Silverlight介面,收集需要圖片進行美工處理。
使用工具: Expression Blend 4 (Silverlight介面) & GIMP 2(圖片編輯處理)
使用語言: XAML & HTML
花費時間:約7天
4.邏輯處理及動畫效果處理:
編寫滑鼠及鍵盤輸入的事件處理及資料儲存處理,設計動畫效果。
使用工具: Visual Studio 2012(編寫程式) & Expression Blend 4 (Silverlight動畫
)
使用語言: C# & XAML
花費時間:約5天
5.設計伺服器及AJAX通信技術:
編寫PHP伺服器的MySQL資料庫存取的處理,以及把資料結合成XML輸出。
編寫網頁介面端Ajax連結伺服器的傳送處理,以及接收XML資料的處理。
把伺服器架到網站空間,進行連線偵錯。
使用工具: Visual Studio 2012(編寫介面AJAX連結伺服器) & PHPDesigner 7(編寫PHP
伺服器連結資料庫)
使用語言: C# & XML & PHP & SQL
花費時間:約5天
6.偵錯及自訂物件導向工程:
把3~5寫好的程式做一次完整的偵錯。
再重新整理程式碼,進行優化﹑寫成自訂物件。
使用工具: 上述所有用到的發開軟體
花費時間:約5天
7.開放網站多人連線偵錯:
讓會員註冊及上傳檔案,進行資料庫及流量等多執行緒的偵錯。
收集會員意見及修正錯誤地方,新增功能等等。
使用工具: 上述所有用到的發開軟體
花費時間:約2星期
心得:
以上過程都是獨自摸索而來~需要經驗的板友可以來信問我。
在編寫Silverlight的時候很痛苦,教學用的書好少,Google大神找到的參考資料幾乎
都是英文不然就是內地文(我討厭內地文),線上也找不到任何人可以問。
一下子C#一下子PHP一下子MYSQL好累又遇到UTF-8伺服器發送E-MAIL變亂碼,處理過程
頭都快炸了,但第一個使用網站的人跟我說:網站好特別,很好用。以上的辛苦都格式
化哩。
沒什麼基礎的我也成功架好站了~
相信以好的構想出發,堅持到後最一定會成功的!
希望能找到同樣陷入silverlight的朋友,嘛..雖然學這個在台灣難以混飯吃~但成就感
是很大的喔。因為台灣超少人寫silverlight!
----------------------------------------------------------------------------
PS: 網站目地是 單純讓會員間低調分享音樂,三天後會恢復成非會員無法聆聽音樂!
對ACG音樂內容有趣興敝站定歡迎您加入~
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 122.100.81.158
※ 編輯: sakuraakira 來自: 122.100.81.158 (03/30 07:30)
2F:推 ashram:推一下silverlight 之前也寫了三年 03/30 14:22
3F:→ sakuraakira:壞了那個應該是有Unicode補完的關係~會讓uft-8寫的程 03/30 16:58
4F:→ sakuraakira:解碼錯誤變亂碼 03/30 16:58
5F:推 airtsubasa:silverlight有推薦的書或網站嗎? 03/30 17:52
6F:推 winken2004:推 03/30 19:26
7F:推 PTTLSboy:推,加油!! 03/30 22:55
8F:推 Carlchen:推Visual Studio 2012 and Blend!!! 我也好想寫個網站喔~ 03/30 23:41
我簡單介紹Silverlight
是微軟當初為了跟Adobe的Falsh爭市場而開發的用戶端介面程式,因為都要另外安裝插件
,讓人覺得這兩者是似類的東西。
但把Silverlight當成Falsh來寫然後插到網頁的方式,我個人覺得是錯誤的。
Silverlight由兩個部份組合而成,兩種語言。
1.介面(XAML語言) : 你可以把他當成 HTML+CSS (但功能及性能都強大多了)
2.程式(C#或VB語言) : 你可以把他當成 JavaScrinpt
編寫的時候XAML裡的標籤用Name來命名,接著用C#去調用它;
跟HTML裡的標籤用ID來命名,接著用JavaScrinpt去調用它,跟本是一樣的東西!
Silverlight的頁面固定由.xaml檔及.cs檔 2個組合而成,
跟.html檔插入CSS,JavaScrinpt 或另外載入多個.css檔.js檔 比較起來簡單許多
個人認為把Silverlight當成HTML來寫才是正確的決定。
一些優缺點:
缺點XAML資源及範例少,HTML到處都找得到資源。比較起來難製作許多,
優點是製作完成的作品難以被抄襲。(不會被剪下貼上)
缺點需要經過Silverlight解析才顯示畫面,不像JavaScrinpt可直接由瀏覽器解析。
優點介面跨所有瀏覽器,不用擔心像CSS JavaScrinpt在不同瀏覽器出現不同效果。
缺點內容很難被搜尋系統(ex:Google) 搜尋到..
優點內建強大的函式庫,強大到我難以解說但可以說jquery是無法比的。
詳情看這
http://msdn.microsoft.com/zh-tw/library/cc838194(v=vs.95).aspx
英文無解可以用網頁翻譯~
學習的路途很艱辛,初學者可以先從"介面部份"開始
安裝Microsoft Expression Blend 4 參考"Silverlight補給站"網站,設計介面慢慢來!
而"程式部份",就必需打好C#的基礎,可以先參考C#教學書,這部份我還沒看到講解
得很棒的書或網站,可能要多參考別的人C#程式 :(
先安裝Microsoft Visual Studio 2012 學會自己寫Class,弄懂物件導向是什麼,
慢慢就會了解silverlight不過是一個規劃好的各種用來製作物件的函式庫。
9F:推 wayren:很棒的音樂網站 給推 03/31 13:28
10F:→ wayren:double click事件改成click好像會比較直覺一點 03/31 13:28
11F:推 truesword:很棒的分享!! 網站超酷的 03/31 15:04
12F:→ faerie0218:個人不是很欣賞使用SILVERLIGHT來做...像我是不安裝的. 03/31 18:55
13F:推 shadowjohn:很不錯的網站~~~只是圖片跟音樂沒有版權嗎@_@? 03/31 23:29
敝站不像grooveshark或youtube等線上媒體播放一樣,推說不知道會員上傳檔案是否違反
數字版權法來免責(有事先聲明),並且監控媒體檔案,侵權立即要求會員下架。
而是採用像論壇網站,檔案內容只提供給會員的隱匿性分享。
會員上傳檔案行為,只是"把檔案傳到我私人"租的伺服器=只把檔案傳給我。基本上起訴
會員也沒好處。
而伺服器所有人的我要負的責任則是"把音樂分享給會員聆聽",不營利不公開不接受廣告
贊助來減輕侵權行為。不過追訴起來一定是要關站的。
※ 編輯: sakuraakira 來自: 122.100.81.158 (04/01 02:44)
14F:→ sakuraakira:所以兩天後~非會員就只會看到空白桌面~ 04/01 02:47
15F:→ ck574b027:我也是喜歡日文討厭內地文 04/01 17:20
16F:推 kenuser:iOS 殘念 04/01 19:56
17F:推 DingWeizhe:雖然不推Silverlight 但大推作者勇敢追夢 04/02 09:52
18F:推 TCFmars:不錯喔,自學就能做出這種風格!加油 04/03 02:04
19F:推 ufoufoufo:很棒阿 有看到夢想 :D 04/03 03:36
20F:→ LearnRPG:如果今天不想用 Silverlight, 純以html+css+js 要做到 04/03 11:07
21F:→ LearnRPG:這樣的網頁 有類似的套件嗎 ?? 04/03 11:07
22F:→ LearnRPG:還是就是用 jquery 苦功刻了 ... XD? 04/03 11:08
23F:推 jinn:太棒了,介面直覺又漂亮,推一個! 04/04 20:30
24F:→ sakuraakira:據我的經驗,一些功能Html+jquery也無法做到,需要HTML5 04/05 07:26
25F:→ erotic:我一直覺得資訊工作是所有專業工作中入門門檻最低的一種 04/14 11:00
26F:→ erotic:因為日常生活就能接觸到資訊相關事物(網路、網站等),是很 04/14 11:01
27F:→ erotic:生活化的東西, 不見得科班出身就一定能寫出像樣的東西 @@ 04/14 11:02
28F:→ erotic:非科班出身的人能結合兩種領域的知識,也是很不錯的! 04/14 11:03
29F:推 interboard:強者 自嘆不如 04/22 10:21
30F:推 dewater:好棒的站 04/24 20:34
31F:推 brain00021:大大讚 05/10 00:14