web-archive-me.com » ME » A » AKANELEE.ME

Total: 398

Choose link from "Titles, links and description words view":

Or switch to "Titles and links view".
  • 嫁給RD的 UI Designer
    UI 用的 Photoshop 螢幕設定吧 就 色彩管理 和 解析度 的部份 本文參考 Colour management and UI design 和 Designing for Retina display part two 所寫 Read on 8px 後續 模糊 February 21 2014 Comments 8px那篇引起很多回應 我想這要從幾個角度來解釋 UI 口中的 糊 和 RD 眼裡的 糊 是有差的 圖片會糊的原因分成幾種 小圖放大會糊 這是廢話 BJ4 大圖縮小會糊 一定有人想問為什麼 就算是向量檔 只要像素沒有對齊一樣會糊 PX 非整數 Pixel 沒有0 x 這種數值 Read on 關於 8px February 19 2014 Comments 淘寶網的官方Blog有篇 一张图解释手机端8px原理 簡單來說就是把 iOS 和 Android 放在一起比較 同時探討 1x 2x ldpi mdpi hdpi Xhdpi xxhdpi 的尺寸與解析度 本文就以我個人角度提出看法 圖片取自 Android Devices and Displays Read on 學習UI UX的四大重點 February 18 2014 Comments 關於剛踏入業界需要準備什麼 或是想轉換跑道需要具備哪些技能 選擇 UI UX 這條路就是要有包山包海的心理準備 大致上我會把它劃分成四大類 理論 實踐 技術 品味 這四類缺一不可 Read on Adobe Muse CC 心得 February 17 2014 Comments Adobe Muse CC 是為了想要建立網站但不想撰寫程式碼的設計師而設計 官網開章明義就直接寫了這句話 好吧如果是為了不會手寫Code的設計師 只需要產出一些不需要套用程式的網站的話 Muse 是滿有吸引力的 先不提它產出的 Code 很噁心這件事 Read on QRCode 神器 iQR codes February 10 2014 Comments 做手機和網頁互動 常常會遇到 QRCode 設計 QRCode 在大家的印象裡就是黑黑一塊塊的格子組成的方磚 對設計師來說最大的困難在於如何把這個黑方磚改造一下 但又不能太出格仍舊要讓使用者一眼明白這是可以掃瞄的 Code QR 碼圖形如果有破損 仍然可以被機器讀取內容 最高可以到 7 30 面積破損仍可被讀取 講是這樣講 但實際掃起來的容錯率會因為使用的掃描工具不同而有落差 在改動上保守一些比較安全 Read on 關於使用者經驗測試 January 28 2014 Comments 我很喜歡有人問問題 這表示不用絞盡腦汁想 blog 文章主題 有問題就盡量問吧 不管是留言 Twitter 或是寫信都可以 關於使用者體驗與使用者介面的測試 怎麼測試這樣的設計對使用者來說是好的 便宜有便宜的作法 難有難的深入 我的領域不是跟數據打交道的那塊 加上時間成本 和偷懶 我大多便宜了事 這麼理直氣壯的說好嗎 以下是個人觀點 Read on 愛用切圖神器 Slicy January 26 2014 Comments Slicy 是我測過幾種輔助切圖工具後又回來使用的神器 把整個 PSD 扔進去 結束 簡潔利落不囉嗦 我愛它的程度已經到了沒有它我就不會切圖了 哈哈 Read

    Original URL path: http://blog.akanelee.me/?page=19 (2016-05-02)
    Open archived version from archive

  • 嫁給RD的 UI Designer
    說穿了其實不管是哪位 UI UX 大師 講的都是同一件事情 要怎麼做才能讓使用者好用 從這張圖表有看出什麼了嗎 第一個直列 白底 就是我之前提到的 使用者經驗分層元素 第二個直列 黃底 是 使用者經驗藏寶圖 第三個直列 藍底 是 十大易用性原則 使用者經驗分層元素裡並沒有說明文件 這項是我自己加上去的 為了讓整個專案更完整 並且能夠傳承下去 Read on 使用者經驗分層元素 January 10 2014 Comments 想了解 UI UX 就一定要了解這張圖 這是 Jesse James Garrett 在 2000 年發表的使用者經驗元素一書中所提出 使用者的經驗可分成抽象到具體 也就是由策略 範圍 結構 骨架 表層所構成 圖片上有原作者的說明大家自己看吧 Read on 3 種應用程式風格 January 6 2014 Comments 不要再叫 PM 或 BD 畫 Wieframe 他們真的不是 UI UX 的專業人士 如果注重專業 在約還沒簽 規格也還沒訂出來的時候就該把 UX 加進工作流程裡了 PM 最重要的工作是控管時程 各部門單位間溝通 BD 是廣義的 Marketing 也不該是這個位子的人在搞介面 畫 Wireframe 的是 UX 啊 UX Read on 我的推薦書單 January 2 2014 Comments 把家裡打掃完了 來講講我手上覺得不錯 值得推薦的UI UX 網頁 設計相關書籍好了 桌上這幾本都是我千挑百選才肯買回家的好書 有些比較舊或有點過時就跳過不講了 有興趣的可以去書店找找 多看書總是有好處 就從左邊開始介紹囉 Read on Guideline 的重要性 December 31 2013 Comments 強調再強調 一定要先看過 Guideline 後再來做介面設計 卻被人嗤之以鼻 說不用看一樣可以產出啊幹嘛要花這種時間 如果不是你的產品太簡單 就是都用內建元素或抄襲湊合了事 你同事人太好 幫忙擦屁股了 你同事程度跟你一樣 搞不清楚狀況 別說很多 UI 高手們也老是跳脫 Guideline 設計啊 他們哪位不是對 Guideline 熟到可以朗朗上口到幾乎可以報頁碼的 不懂 Guideline 的就只能當美工用 連視覺設計都稱不上 Read on UI 怎麼面對 RD 的美學 December 30 2013 Comments 應該沒有 UI 會跳出來寫這種文章 哈哈 這篇應該要歸類在 RD 老公觀察紀錄 裡 不過本文主要想聊聊從 UI 的角度來觀察 RD 在工作上的美學 至於生活上的就另開一篇再討論了 我合作過的 RD 人數不多 出社會到現在大約 70 位左右吧 樣本數不夠大 但這 70 位都有個很明顯的特質 非黑即白 沒有灰色 RD 的世界不是 0 就是 1 就跟 iOS 切圖沒有 131 x 327 的 2x png 要縮小成 1x 檔這玩意一樣 Read on 我的 UI UX 設計入門方式 December 26 2013 Comments 自從開了這個 BLOG 後

    Original URL path: http://blog.akanelee.me/?page=20 (2016-05-02)
    Open archived version from archive

  • 嫁給RD的 UI Designer
    19 2013 Comments Pochade 我愛用的截色 App 最近在工作上遇到關於配色的大難題 公司 LOGO 是深藍 亮橘 但要做的專案和股市看盤有關 所以要加入紅色和綠色 要求官網 網頁版系統 Desktop App Mobile App 都要一致性 能讓人一眼就看出來這是該公司的產品 要有企業形象 一定要用上企業色 偏偏扯到 股市看盤 就不會只有兩條線在畫面上跑這麼簡單 Read on 使用者經驗藏寶圖 創建人物 December 18 2013 Comments 相信各位應該看過前一篇 使用者經驗藏寶圖 敘述故事 找出中心思想 了 也相信一定有人用鼻孔噴氣 什麼鬼話連篇 拿灰姑娘出來當例子 小孩子玩家家酒 這個階段我就認真寫好了 在 創建人物 這個階段 其實就是研究方法 Persona 人物誌 都把研究方法拿出來講了 夠認真了吧 Read on Responsive Web 抱怨篇 December 17 2013 Comments 老實說 自從我一頭栽進 Responsive Web 的世界 又接觸 Bootstrap 後 很久沒去思考 在 Responsive 上我還能玩些什麼花樣 有人跟我提過 Bootstrap 雖然好用 但也限制許多可能性 所以他們不喜歡 我倒認為它只是項工具 要在網頁上套用它就必須遵循它的規則 Read on 使用者經驗藏寶圖 敘述故事 找出中心思想 December 12 2013 Comments 雖說很對不起邀我來參加聚會的主辦單位 但 UI 和 RD 擅長的領域差不多就是聖母峰和馬里亞納海溝的差別 為了不浪費這段人人都在補充新知我卻蹲在旁邊玩保衛蘿蔔2的時間 還是來寫點文章表示我也有努力好了 根據這張藏寶圖的順序 就來談談 敘述故事 找出中心思想 Read on 互動設計概論 December 12 2013 Comments 什麼是互動設計 互動設計這個詞這幾年很常見 包山包海感覺上只要是各種媒體上看到會動都可以叫互動設計 有一種說法是 設計出互動產品 提供人類在日常生活或工作中使用 更詳細的解釋則是 互動設計是人類互動及溝通上的空間 它是一種以使用者的需求與經驗為出發點 創造出人類與科技的完美連結 IDEO 創始人在 1984 年的一次設計會議上提出 他剛開始將互動設計命名為 軟面 Soft Face 但這名字很容易讓人想起當時流行的玩具 椰菜娃娃 後來將名字改為 Interaction Design 從 Soft Face 這個最早期的命名方式可以看的互動設計的特性 沒有規則可讓人任意塑造扭曲 是在最表層如臉孔一般的存在 Read on 製作過程 Anna Sui Wallet December 11 2013 Comments Icon Design My Wallet 真的讓我拿到 Dribbble 帳號了 為了感謝大家的支持 喂 我把創作過程和思路放出來 簡單來說呢就是硬上 沒什麼華麗麗的技巧 不停加圖層加高光加陰影 畢竟這是我第一顆刻這麼細的擬物風 icon 之前都在接案公司工作 哪來 30hr 的時間慢工出細活 大概是做習慣 iPhone 和 Android 的 App UI 凡是製圖我都優先考慮向量格式 即使這 icon 不可能上架 我還是做成向量格式 至少邊緣乾淨銳利漂亮 Dribbble ANNA SUI wallet Read on 在開發之前 先潑冷水 December 10 2013 Comments 這點子太棒了 之前肯定沒人做過 將來一定大賣啊 你確定嗎 在 App Store 已上架有 n

    Original URL path: http://blog.akanelee.me/?page=21 (2016-05-02)
    Open archived version from archive

  • 嫁給RD的 UI Designer
    MACBOOK PRO 還得加滿 RAM 舊 AIR 跑不太動 希望有人可以因為這顆 icon 分我個 Dribbble 的邀請碼 真的拿到了 感謝 Mike Bronk Read on 使用者經驗藏寶圖 序 December 5 2013 Comments Peter Morville 設計出 使用者經驗藏寶圖 如圖 說明一個構想是怎麼合理且適切地無中生有 一直到完成設計提出各式文件給客戶的開發流程 我覺得這是每位UI RD PM都該知道的流程 同時也是開發產品的必經之路 身為專案成員不應該悶著頭只做自己份內的事 了解團隊如何運作 每個階段該產出什麼 這點非常重要 Read on 扁平化設計 斜陰影 December 4 2013 Comments 常常在扁平化的 icon 上看到斜陰影效果 要製作這個效果有很多種方式 網路上的教學文也很多種 我就挑了比較簡單的作法來實作順便 PO 自己的作法了 可以結合厚度 讓 icon 更潮 沒辦法 現在就是流行扁平化 厚度 斜陰影 Read on 扁平化設計 厚度 December 3 2013 Comments 這張是 512 x 512 px 的 iOS Desktop icon 原始圖檔 可以看到在我放在 photoshop 分類中關於扁平化設計系列文章所製作出來的效果 高光線真的很重要 細細一條就能帶給人 厚度 和 轉折 的視覺效果 Read on 扁平化設計 折頁 December 2 2013 Comments 翻頁效果也是很常見的扁平化小技巧 簡單幾個步驟就能完成了 請接著 扁平化設計 高光 陰影 繼續做喔 Read on 扁平化設計 高光 陰影 December 1 2013 Comments 有了基本雛型後可以開始添加細節 從放大鏡icon的優化開始 如果有上過素描課 老師會說明高光和陰影的重要性 扁平化設計將視覺元素抽掉很多 高光 漸層 陰影等基本組成因此變得更重要 更需要注意每 1px 的細部處理 Read on 扁平化設計 基本雛型 November 30 2013 Comments 扁平化設計是現在最流行的設計趨勢 比起擬物風 扁平化設計去除大部份的材質和光影變化 但仔細觀察 仍保有許多細節 無論是陰影 漸層 高光 立體感等 並不因 扁平 而隨意帶過 這個教學不太需要修圖技巧 只要會用 形狀圖層 就好 為了因應各種尺寸的 icon 我習慣盡可能用向量來製圖 Read on 各式按鈕背景 進階篇 November 29 2013 Comments 這篇會教大家怎麼在按鈕外圍做一圈凹陷的陰影 為了教學需要 有故意將效果做得誇張些 如果知道原理了 記得把數值調小一點比較自然 請接續 各式按鈕背景 基本篇 製作 Read on 各式按鈕背景 基本篇 November 28 2013 Comments 最常見的按鈕就是個長條型的色塊 配上文字說明讓使用者知道點擊這個色塊能達到什麼目的 讓這個色塊擁有像現實生活的光影變化 在視覺上更顯精緻 可接著 各式按鈕作法 文字篇 的步驟接著做 Read on Newer Blog Archives Older Akane Lee Recent Posts UI 設計入門班 學員心得 UI UX

    Original URL path: http://blog.akanelee.me/?page=22 (2016-05-02)
    Open archived version from archive

  • 嫁給RD的 UI Designer
    2013 Comments 一個 App 通常會有很多張切圖 不管是 iPhone 需要 1x 2x 圖檔 Android 需要至少 3 種 hdpi xhdpi xxhdpi 在龐大的切圖數量下如何讓負責套圖的 RD 快速找到所需圖檔 檔名的命令方式就需要雙方統一格式方便大家作業 Read on 改不停的設計與加班 November 22 2013 Comments 台灣是個很不尊重專業的地方 尤其是設計這個行業 相較之下 沒什麼人敢第一時間質疑醫師開的藥方 也沒幾位敢對著律師嗆聲說法條引用錯誤 更不會有人衝進廚房搶大廚的鏟子煮給他看 做設計做久了 從沒被客戶改稿改超過 5 次以上的人真的需要燒香拜佛感謝老天保祐 相信一定有人被客戶搶過滑鼠 建議改用 Wacom 繪圖板 就算客戶跟你搶筆也會因為不懂使用而馬上還你 擺在桌上看起來專業唬人好用 Read on 無損圖片的介面製作方式 下 November 21 2013 Comments 之前在 無損圖片的介面製作方式 上 提到製作 App 介面時會面臨各尺寸螢幕解析度不同的問題 PSD 需要放大縮小使得最後產出得切圖模糊失真 本文將介紹智慧型物件 智慧型濾鏡 在ai畫好 貼到ps的技巧 遮色片 調整圖層等不同的技巧 Read on 無損圖片的介面製作方式 上 November 20 2013 Comments 目前市面上最常見的被用來設計 APP 介面軟體為 Adobe 的 Photoshop 和 Illustrator Illustrator 屬向量軟體 不管再多次的放大縮小 向量圖的質量不會因此改變 Photoshop 是繪圖影像處理軟體 像素圖片一經放大縮小後畫質會變差 偏偏目前 iOS 需製作 2 種 Android 至少也要作 3 種尺寸的圖檔 有時候還會有不知道哪邊來的交辦要 UI 協助製作 等身高大 iPhone 為了提升畫面的精緻度 和對付這種強人所難的需求 還是盡量以無損圖片方式製作圖稿 運用比較靈活 Read on UI 跟 RD 溝通的三個誤區 November 19 2013 Comments 我相信一定有 RD 想砍了他們家的 UI 講話這麼風花雪月 有點邏輯概念是會怎樣 也一定會有 UI 想撬開他家 RD 的腦袋 都用這麼多形容詞和例子說明了怎麼還是聽不懂 腦袋有洞喔 這其實真的不能怪 UI 或是RD 他們本身的思考迴路本來就不一樣 達文西這種超神級人物有史以來也就這麼一位 他是畫家 雕刻家 建築師 音樂家 數學家 工程師 發明家 解剖學家 地質學家 製圖師 植物學家和作家 要求平凡人等文武全才也太超過了 這篇文目的在分享和 RD 相處的經驗 順便捅我家老公 不代表所有RD 都是這麼缺筋 RD 也有百百種人啊 Read on 十大易用性原則 November 18 2013 Comments 身為 RD 的你受過太多 UI 的氣嗎 老是發現邏輯不通需要打掉重練被延誤時程嗎 常被 UI 嫌念理工的沒有美感都不懂嗎 報仇的時間到了 這篇文雖然說是 十大易用性原則 也可以說得上是 教你如何捅 UI RD 最擅長講理 就來跟 UI 講理 從易用性下手找 UI 麻煩 沒有幾位 UI 不中刀的 Read on 什麼是 Wireframe November 16 2013 Comments 老實說我受夠某客戶和某設計公司老是把 Wireframe 喊做

    Original URL path: http://blog.akanelee.me/?page=23 (2016-05-02)
    Open archived version from archive

  • 嫁給RD的 UI Designer
    相處啊 但即使和老公很有默契 遇到夫妻吵架 還是會大喊 RD 的腦袋真不知道在裝什麼 Read on 三年前 三年後 November 13 2013 Comments 結束近3年的接案公司App製作生涯 轉向開發公司自有產品 寫這篇文的同時 RD 老公正窩在旁邊玩他的魔獸卡牌 OLG 想起當年我的 UI 是被這位 RD 海電練出來的 三年前 大約是 iPhone 3GS 在台灣剛上市的時候 UI的這兩個字並不像現在這麼流行 相關資源也沒有現在這麼豐富 我正好從一間專門接公家機關的標案公司離開 這間公司專門做像是公文 差勤 電子表單之類 都是些功能複雜的大型系統 近百位員工中只有我一位美工 職稱是 網頁美工設計工程師 對 當時我只會用 Dreamweaver 也被掛上工程師的頭銜 那兩年的工作經驗奠定 UI 非常重要 的想法 Read on Newer Blog Archives Akane Lee Recent Posts UI 設計入門班 學員心得 UI UX 吃貨群 2016 年 4 月書櫃 UI 設計師看 Auto

    Original URL path: http://blog.akanelee.me/?page=24 (2016-05-02)
    Open archived version from archive