To understand 5G, the first two sectors of knowledge I intended to learn were information about how it works technically, and how the technology impacts our society. Fortunately, tons of good quality resources on the Internet have thoroughly explained the technology and its effects.

As I consumed the articles and videos answering my questions about how 5G works and the impacts of the technology, the specs and standards of 5G in the materials constantly confused me, and raised more questions. Why the latency value mentioned in this article is different from that video? Who’s actually building out the technology? Is…


Building a design system to support one product is not easy — it has to be robust and flexible at the same time for scalability. Though challenging, lots of great resources have shared useful principles and approaches that help teams build a good system both visually and programmatically. Standing on their shoulders, this article tries to contribute to an untouched ground by focusing on building a good system in SwiftUI.

Why do I write this article

During my first summer in ITP at New York, I’m lucky to have the opportunity to work as an iOS developer intern at Line Break Studio. One task I’ve been…


👉 Originally posted on vinceshao.com

CodingBridge front-end development workshop is one-month-long tutorial session hosted at ITP. The workshop is targeted at participants coming from creative/art background with the goal of helping participants grow practical elementary front-end skills and more importantly, a developer mindset.

What’s CodingBridge

CodingBridge was the final project created in Open Source Studio at ITP in 2018. The original idea I had, as documented in the old repo, was this:

CodingBridge is an experimental non-profit programming tutorial platform that helps adult beginners with no programming experience to learn with less anxiety, more confidence. …


Confluence, Jira, Airtable and Abstract

👉 中文版連結 (Chinese version) / Originally posted on vinceshao.com

Working as a front-end developer for nearly two years, I’ve got helpful experience from being part of several web development projects of design/digital agencies.

One obvious but valuable lesson I’ve learnt is that collaborating between each groups with one goal but distinct responsibilities and purposes is not easy. There’re different aspects and levels of difficulties in terms of collaboration, and the specific part of which I’d like to address here is workflow process.

Based on my experience, and with the help from my designer and developer friends, I built a website…


Confluence, Jira, Airtable and Abstract

👉 英文版連結 (English version) / 原刊登於 vinceshao.com

在將近兩年的前端工程師職涯中,我有幸參與了幾個數位與設計團隊的網頁開發案,並從中獲得不少寶貴的經驗。

其中一個很老掉牙但重要的體悟,是合作的困難;更準確的說,是在一個擁有共同目標案子中,整合各個擁有不同職責的角色的困難。在這個難題裡,有各個方向與層面的問題值得我們探討,但今天我想跟大家分享的,是工作流程的議題。

透過過去的經驗,我藉由幾個工程師與設計師好友幫助而設計出一套網頁開發工作流程。這套流程的特別之處在於,它是針對十到十五人的小團隊、並且由 Confluence, Jira, AirtableAbstract 組成的。接下來,我會依序介紹為什麼要設計這個流程、以及怎麼使用它。

為什麼要設計一套新流程

如果不使用任何套版工


🎉Initial commits 🎉

Brief Introduction

After the transition from graphic designer to developer and worked as a front-end developer for a year, I started another journey of studying ITP (Interactive Telecommunications Program) at NYU. I’m currently taking course Open Source Studio, which requires student to either contribute to an existing open-source project or start a new one as final project.

Though I have no experience of contribution to open-source community, I decide to try to build my ambitious dream of helping more talented designers, artists and creatives to learn programming with less anxiety, more confidence. …


👉 English Version (英文版連結)

UI 設計師的工作壓力很大。除了要做出好設計之外,設計師們有時得面對客戶跟上級的壓力、有時得負責使用者經驗跟流程的研究、而且還要苦惱於如何跟有效率的工程師溝通。為了減輕設計師朋友們的負擔,我將試圖從讓很多設計師頭痛的狀態管理著手,介紹一個更好、更輕鬆的處理 UI 狀態設計的方法。

我一直都知道處理 UI 狀態變化的設計很麻煩,因為要為了一個組件做多種變化很惱人。但後來發現,其實設計本身一直都不是狀態設計的痛點,東補西補缺漏的狀態設計、以及精準地告訴工程師什麼時候要怎麼做才是癥結點。因此,如何從頭開始避免缺漏狀態和與工程師精準溝通將是本篇文章的重點。

狀態和 Flowchart

為了讓設計團隊準備好所有需要的狀態,大家一直有在提倡這五種基本狀態讓設計師參考。這些狀態是必要存在的,但如果要求更精準的定義的話,我想有需要先區分狀態與前台視覺(視圖/view)的差異:狀態其實只是一個 UI 組件在接收到輸入(input)後的輸出 (output)、而一個狀態不一定需要相對應的前台視覺。

也就是說,雖然一個 UI 組件可能只擁有五個狀態,但每一個卻可能擁有多種視覺的可能。如果不太懂,看一下這個送出按鈕 (submit button)的例子應該就可以理解了。


👉 Chinese Version (中文版連結)

👉 Read the post on vinceshao.com

Life can be tough sometimes for UI designers. While they get to create great designs, they also get to deal with pressure from clients or PMs. They’re required to consider user experience and user flow. And they often struggle to find an effective way to communicate with developers.

To relieve some of the pressure from my fellow designers, I want to help by introducing a better way of handling UI components with state variations. I believe this is one of the biggest challenges designers face.

Dealing with state variations of…


👉 English Version

2017對我來說,是個高潮迭起的一年。

我在三月離開了夢想的設計師職位,並在學習前端與程式碼的深淵裡自學了五個月後,如夢似幻的在轉轉成為了前端工程師。

那五個月的歷程中,因為資訊實在太爆炸、有太多東西要學,對我這個毫無數學天份、電腦課都直接複製同學 USB 檔案的標準一類生而言,多數時間都是充滿焦慮和迷惘的。所以一年後,我重新檢視去年的學習過程,並且整理出簡易的心得和建議,希望能給像我一樣的人一些幫助。


👉 中文版連結 (Chinese Version)

👉 Read the post on vinceshao.com

2017 was a bumpy yet exciting year for me. I left my graphic designer job in March, and entered the maze of the coding world. Five months later, I finally got a job as a front-end developer at Tenten.co.

Having been a full-time front-end developer for six months, I’d like to share my story of why and how I pivoted my life path. This is for those who might be as helpless but ambitious as I am.

To be clear, this post is not written from the perspective of a…

Vince MingPu Shao

A programmer who understands design language | Based in Brooklyn, NY | vinceshao.com

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store