iT邦幫忙

ui相關文章
共有 104 則文章
鐵人賽 自我挑戰組 DAY 29

技術 【Day29】UI設計軟體小比較

實際使用了Sketch、Figma、Adobe XD 以後,雖然Adobe XD的部分都沒有在這邊有詳細的操作,因為在習慣用Sketch之後發現Adobe XD...

鐵人賽 自我挑戰組 DAY 28

技術 【Day28】Figma篇 : 實作

今天試著全用Figma做一個UI設計,無論是插圖或是icon都是在Figma內畫出來,Figma的畫筆不會不好用但是在使用上還是會比較習慣Illustrator...

鐵人賽 自我挑戰組 DAY 24

技術 【Day24】Figma篇 : Layout Grid

Figma的Layout Grid就是跟Sketch的Grid System一樣的東西,但是Figma有一個特別的地方,就是除了可以像我們熟知的建立在Frame...

鐵人賽 自我挑戰組 DAY 24

技術 美麗與邏輯:UI/UX

塞這主題是為了完整性 但我其實沒什麼資格來介紹這兩大topic就是 所以只會從工程師的觀點來講 連假偷懶一點吧 UI是 user interface 所以通常是...

鐵人賽 自我挑戰組 DAY 11

技術 【Day11】Sketch篇 : Smart Layout 終篇

前面幾篇我們提到Smart Layout的小技巧和後續小延伸,可以大概思考一下其實如果再結合普通配置的Symbols,其實可以延伸的還滿多的喔~ 像我在專案中就...

鐵人賽 自我挑戰組 DAY 6

技術 【Day6】Sketch篇 : Nested Symbols 一個創造經典的角色

Symbol特色 3:Nested Symbols Nested Symbols不僅是Symbol中最經典的功能,也是能將我們的設計系統活用的重要角色。 我們提...

鐵人賽 自我挑戰組 DAY 5

技術 【Day5】Sketch篇 : Overrides是什麼神奇的小東西

我們昨天實際用 Artboards(畫布) 是 html 的環境、Symbol 是 class的連結想像,並進一步以Symobls的替換為例,不過並不是只有單純...

鐵人賽 自我挑戰組 DAY 4

技術 【Day4】Sketch篇 : 原來Sketch跟Html也滿像的

上一篇我們大概提到Sketch跟網頁切版的Html、css概念很像,今天我們則是先來看看Symbol的部分。 Symbol特色 1:替換 替換這個功能,就是讓我...

鐵人賽 Mobile Development DAY 5

技術 Day 5 - Android TV UI Guidelines Part 2

今天我們來介紹 Android TV 的 UI 組成,以及有什麼方法可以讓你的 APP 曝光率增加唷 首頁 上圖是 Android TV 的首頁 可以看到所有...

鐵人賽 自我挑戰組 DAY 3

技術 【Day3】進入Sketch篇

Sketch應該是這三個軟體(Figmas、Adobe XD)中最成熟的設計工具了, 但是只有mac系統可以使用的sktech,到底是怎麼持續處於領先的王者地位...

鐵人賽 Mobile Development DAY 4

技術 Day 4 - Android TV UI Guidelines

差不多該進入 Android TV 開發的主題了 雖說 Android TV 和 Android Phone 都是 Android 系統 但是還是有些地方需要去...

鐵人賽 自我挑戰組 DAY 2

技術 【Day2】從疑問開始的學習

從2019的年度設計工具調查與google爬文中,大概可以歸類出3大軟體的幾個重點和疑問: Sketch 目前似乎是市占率最高的軟體,為什麼只有mac的系統...

鐵人賽 自我挑戰組 DAY 1

技術 【Day1】學習的動機

指南閱讀聲明:此系列文章非教學指南文,無從0開始可以學會的加持作用。 對於UI設計師而言,最重要的工具不外乎就是UI設計軟體了。 但是因為有太多個UI設計軟體了...

鐵人賽 Mobile Development DAY 11
Flutter App 開發實戰 系列 第 11

技術 來做個儲值頁面吧 [DAY 11]

這個專案會有需要讓使用者進行儲值的動作,所以我們就要來設計一個選擇儲值金額的頁面,頁面上需要顯示目前的餘額、4種金額可以選取和前往付款的按鈕,今天我們會先從 U...

鐵人賽 Mobile Development DAY 8

技術 iOS Developer Learning Android. Lesson 08 - ConstraintLayout (運用AutoLayout的思維安排Android畫面)

大家都說ConstraintLayout真是棒 為什麼呢? 主要看到的論述都是可以讓layuot更扁平化,進而提高效能,點我看看Google怎麼說。 再來就是...

鐵人賽 Mobile Development DAY 6

技術 iOS Developer Learning Android. Lesson 06 - 如何製作畫面 (羨慕SwiftUI的Preview嗎?)

今天來跟各位介紹一下前端(廣義的)最重要的部分,也就是UI,俗稱的刻畫面。 也就是我們工程師如何在設計師的刁難要求之下,完成想要呈現給User的樣子。 其中最大...

技術 #Day03 開始啦!成為戰士的那一刻

嗨呦~大家好我是Jasmine (。・ω・。)ノ 接續昨天,今天來告訴各位我的曲折離奇血淚辛酸冒險故事,話不多說那我們開始啦~ 時間回到我去Monospace報...

技術 [觀念] 前端與UI事件

今天發文章是基於 android Intent轉跳問題 這一篇有感而發. 簡單說好了, 不管是 Web,單機程式,手機程式 都會有前端跟後端, 前端就是我們所謂...

鐵人賽 Modern Web DAY 30
挑戰 Daily UI! 系列 第 30

技術 挑戰 Daily UI! Day_30-Pricing && 完稿囉~

最開心也是最傷心的一天 真的很開心自己能夠撐30天發文QQ 如果減肥也可以就好了呢 其實這三十天也證明了我的毅力還是很夠的, 但我不懂為甚麼體重一直下不來(ㄍ...

鐵人賽 Modern Web DAY 30
Daily UI : 開發者版 系列 第 30

技術 Vuetify:Google YoutubeMusic › Advanced Implementation

https://codepen.io/hereiscasio/pen/GRRKdxb 我們可能都遇過有些特殊的響應式設計情境或細節,需透過 JS 處理會更好,...

鐵人賽 Modern Web DAY 29
挑戰 Daily UI! 系列 第 29

技術 挑戰 Daily UI! Day_29-Map

快樂的度過了期中考呢QQ 除了數位系統的成績有夠怕QQ 其他都9X安全度過辣RRR (:3 ⌒゙) 數位系統設計我不懂為甚麼會考那麼低RRRRRRRRRR 雖然...

鐵人賽 Modern Web DAY 29
Daily UI : 開發者版 系列 第 29

技術 Vuetify:Google YoutubeMusic › Static Layout

https://codepen.io/hereiscasio/pen/VwZRmwy?editors=1010 Used UI Component ( #1...

鐵人賽 Modern Web DAY 28
挑戰 Daily UI! 系列 第 28

技術 挑戰 Daily UI! Day_28-Contact Us

好像又再重蹈覆轍了(°ཀ°) 一考完試、休息一下又要繼續趕圖惹orz 目前大概還要50多張的圖片QQ 尤其是禮拜一到禮拜三,到家大概都九點多十點惹 最近真的都忙...

鐵人賽 Modern Web DAY 28
Daily UI : 開發者版 系列 第 28

技術 Vuetify:Google Contact

https://codepen.io/hereiscasio/pen/dybLbVd?editors=1010 Used UI Component ( #3...

鐵人賽 Modern Web DAY 27
挑戰 Daily UI! 系列 第 27

技術 挑戰 Daily UI! Day_27-Dropdown

今天乖乖地用購物彌補悲傷的心情(・∀・) 今天一開心就刷了NT3400多呢(*´∀`)~♥ 不過噴豪多錢RRRR 希望買的衣服能趕快寄到(ノ>ω<)...

鐵人賽 Modern Web DAY 7

技術 MarkMan - 高效的設計稿標註與測量工具

MarkMan – 馬克鰻是一款方便又高效的標註工具,可以節省設計師在設計稿上添加和修改標註的時間,簡單又易用的介面和工具,很快就能上手,除了設計師可以使用,工...

鐵人賽 Modern Web DAY 27
Daily UI : 開發者版 系列 第 27

技術 Vuetify:Google Domain

https://codepen.io/hereiscasio/pen/gOYEXjM?editors=1000 Used UI Component ( #1...

鐵人賽 Modern Web DAY 26
挑戰 Daily UI! 系列 第 26

技術 挑戰 Daily UI! Day_26-Subscribe

台大 == 人生贏家 這是今天得到的結論qq 不意外就是看到題目就...不會寫(´・ω・`) 各種演算法+資料結構qq 我把題目整個看完之後就陣亡了 我的隊友還...

鐵人賽 Modern Web DAY 26
Daily UI : 開發者版 系列 第 26

技術 Vuetify:Google News › Advanced Implementation

https://codepen.io/hereiscasio/pen/eYOomxO?editors=1010 延續昨天的程式碼,今天專門介紹 Vue-port...

鐵人賽 Modern Web DAY 25
挑戰 Daily UI! 系列 第 25

技術 挑戰 Daily UI! Day_25-TV App

怕爆qq 目前人正在高鐵上qq 今天一早不小心睡過頭,又花了$350買北上的高鐵票(メ ゚皿゚)メ 不過很開心跟朋友一起吃早餐(`・ω・´) 還有跟另一個朋友逛...