seven – 第 2 頁 – 成長筆記

Android APP + SVG

2019.11.252019.12.02 seven

自上一篇文章 iOS APP + SVG 測試，SVG效果載入 iOS 算成功一半，還需要測試更多載入狀況，接著繼續研究 Android APP，使用 Android Studio 實測，方向同樣為讀取 SVG、JSON 圖檔為主，經歷 iOS 研究過程，Android 應該也是可行的。

【 Android Studio 】

大致先了解開發環境與介面，主程式安裝後所佔空間不大，整體操作下來還算簡易，有方便圖形介面、框架編寫所見即所得的設計視窗。

“更多推薦“應該出現在購物前還是購物後？(1)

2019.10.282019.11.04 seven

購物/拍賣類型網站、APP，幾乎是把“更多推薦”設置於購物前，若包含熱門分類、限時商品，加上平台內的廣告，推薦區域是琳瑯滿目，個人認為得取決購買目的，“更多推薦”功能需求可能低於使用者“主動搜尋”。

iOS APP + SVG

2019.09.302019.09.30 seven 1 Comment

svg 確實可運用於網頁，一般讀取、匯入即可顯示，效果可透過 svg <path> 路徑變化，或 CSS animation 動畫屬性控制；那 svg 也能在 APP 顯示嗎？使用 Xcode 測試，往“能否讀取svg圖檔”方向，嘗試研究看看。另外也測試由 adobe AE 所匯出的 json 檔是否也用於 iOS APP。

文章觀點評論：防止誤觸按鈕(1)

2019.09.022019.09.02 seven

評論：How to Prevent Users from Mistapping Icon Buttons

【手機版web按鈕】

近期執行的任務剛好有類似案例，就拿手機版web按鈕來論述，於各個不同頁面中添加“轉贈彩幣”按鈕，此功能目的是希望提升轉幣操作的便利性，而添加的頁面，並未全區都針對手機使用者放大元素，按鈕則有特定使用族群，從不同面向來發表個人觀點。

svg已普遍在網頁中使用，是一種向量圖片，可藉由樣式表或程式碼控制，縮放不失真且變化自由度高，可使用軟體(如illustrator)自行繪製、網路提供的元件素材(material design)或線上製作svg動態圖，可於大部分瀏覽器顯示。例如要製作一個圓，樣式表為標籤添加border-radius屬性，svg則為特定標籤<circle>，並添加專用屬性如座標cx、cy與半徑r，兩者圖形本質同樣是使用編碼製作，svg能有更多外型變化優勢。

新手設計家

2019.06.102019.06.17 seven 2 Comments

在寫這篇文章時，室內已經進入清掃收尾階段，目前正在處理客廳四扇落地玻璃門，第一次更換紗網，靠一支短短教學影片看完就上，跟廠商拿了材料，很生手的完成影片中每個步驟，成果看起來還行。在此之前，以為只需要測量好門框長寬，結果到了採買現場，才知道紗網可能沒有零售、壓條也有分粗細，甚至連門把都沒有統一規格(就算把現有門把拆下至現場比對也不同)，店家解釋每批手把生產規格都會有誤差，即使是同款也一樣。居家維修對於新手來說，在動工之前不外乎就是上網看看部落格分享、教學影片，以打帶跑模式緩慢進行每個細節處理。 Read More

CSS樣式表

2019.04.152019.04.16 seven

階層樣式表，簡稱CSS，用於改變HTML文檔模型中的各個元素(瀏覽器則將文檔模型視覺化呈現)，CSS可變更HTML網頁標籤屬性，如區塊大小與顯示位置、間距與外型、字體與匯入樣式(svg、json)等等，或使用動畫屬性(transition)製作轉場效果，帶給網頁多元且自由的視覺優化。

HTML標籤可自由定義類別名，在每個類別名添加CSS屬性來控制樣式，標籤本身也帶有特定屬性，如常用的<div>標籤自帶區塊屬性(block)、<h1>標籤則有32px字級與粗體屬性(font-weight)；若以編寫一個icon為例，大致來說就是選擇HTML標籤 > 添加CSS類別名 > 樣式表內給予相關屬性讓它看起來像一個圖標。

See the Pen
xerYdj by wenchi (@wenchi06)
on CodePen.

( HTML標籤種類有很多如按鈕、文字、表單、區塊、選擇器等等，皆有固定用途，類別名可依需求再添加複數；如上圖中每項屬性與值，為標籤做宣告)