Return to Video

Instagram 的 Kevin Systrom 解釋什麼是像素。

  • 0:01 - 0:04
    小小的說明一下 | 什麼是像素
  • 0:06 - 0:12
    (快門聲)很好。
  • 0:12 - 0:14
    我創辦了 Instagram,
    和我的合伙人 Mike。
  • 0:14 - 0:19
    一開始,我們看到手機
    有個機會能夠創建新的事物。
  • 0:19 - 0:23
    因為這是人們第一次可以
    隨身攜帶一台電腦在口袋。
  • 0:23 - 0:27
    然後我們決定它就是圖像分享,
    它大概最有機會,在未來的五年,
  • 0:27 - 0:32
    那些貼近心靈的、
    那些我們願意花時間的,
  • 0:32 - 0:38
    能有個 app 或想法當然不錯,
    但除非它能解決現實生活的問題,
  • 0:38 - 0:42
    不然人們絕不會去使用它。
    所以這個重點就是:你解決了什麼問題?
  • 0:45 - 0:48
    (Piper - 攝影師)人們面對的第一個問題
    就是要怎麼把一個圖像顯示在螢幕上。
  • 0:48 - 0:51
    他們不得不想出個能
    把圖像打散成數據的方法。
  • 0:51 - 0:56
    在 1957,早期的一名計算機工程師,
    名為 Russell Kirsch,拿了張他的孩子的相片,
  • 0:56 - 1:03
    然後掃描它,因此有了第一個數位影像,
    顆粒狀、黑白的照片。像素也因此誕生了!
  • 1:03 - 1:08
    像素(Pixels)是個有趣的概念,
    因為你不是很容易能看得出來它們。
  • 1:08 - 1:13
    而事實上,如果你有個放大鏡,
    你把它放在螢幕前,就可以
  • 1:13 - 1:18
    看到你的螢幕是由無數微小的
    亮點所組成,最有趣的是,
  • 1:18 - 1:22
    那些帶著微光的小點,
    是帶著不同顏色的光點。
  • 1:22 - 1:28
    分別是紅、綠、藍,像素集合
    在一起,遠看就會形成一個圖片,
  • 1:28 - 1:33
    而他們只是小燈光的開和關,
    這些的組合創建出了圖像,
  • 1:33 - 1:36
    還有你使用電腦時每天看的螢幕。
  • 1:36 - 1:43
    也就是你聽到的解析度這個術語,
    在計算機科學和設備製造商常會提到它。
  • 1:43 - 1:50
    解析度基本上是用來衡量
    屏幕上有多少像素的尺寸。
  • 1:50 - 1:54
    回想我還是個高中生時,
    它是 640 x 480 像素。
  • 1:54 - 1:58
    而現在就大的多了,
    接下來的問題就不只是解析度了,
  • 1:58 - 2:03
    還有密度的問題,舉個例子,
    現代的手機也有著相同數量的,
  • 2:03 - 2:08
    稱之為像素的小燈光,但是它們的空間
    更密集,這也是為什麼你的圖像更清晰的原因。
  • 2:08 - 2:12
    那麼,你要如何把那些像素的值
    儲存在一個文件中的呢?
  • 2:12 - 2:19
    你要做的就是把紅色、綠色、藍色
    的值存儲在一個三元組中。
  • 2:19 - 2:27
    不同的值就可以構成一個像素。
    值的範圍是從 0 到 255。
  • 2:27 - 2:35
    0 表示極暗,255 表示極亮,將這些值組成三元組,
    就可以構成單一的像素。
  • 2:37 - 2:44
    圖像檔案,不論它是 jpeg、gif、png…
    裡頭就包含了百萬計的 RGB(red-green-blue)
  • 2:44 - 2:50
    那麼電腦是怎麼儲存所有的數據?
    所有計算和視覺資料是用位元 (bit) 來表示。
  • 2:50 - 2:54
    一個位元有二種狀態:開與關。
    不過電腦上不這麼叫,
  • 2:54 - 3:01
    我們用 0 和 1 來表示,也就是二進位!
    一個圖像實際上就只是一堆的 0 和 1。
  • 3:01 - 3:07
    那為什麼 RGB 的值卻是 0 到 255 呢?
    我們回頭來說說色彩通道 (Color Channel),
  • 3:07 - 3:14
    RGB 代表的是 8 個位元 (bit),合在一起我們稱為一個位元組 (byte)。
    如果你知道數字系統中的二進位制。
  • 3:14 - 3:20
    你就知道 8 個位元所組合起來的最大值是 255。
    255 相當於八個 1 組合的二進位數。
  • 3:20 - 3:30
    而最小的則是 0,相當於八個 0 的二進位數。
    因此,0 到 255 就提供了 256 個不同的通道,
  • 3:30 - 3:36
    用來代表每種顏色的強度,舉例來說,
    我們可以將一個像素的變成綠松石色,
  • 3:36 - 3:46
    用我們傳統的十進制數字系統來表示,
    64(有點紅)、224(很多綠)、208(一些藍)。
  • 3:46 - 3:57
    但電腦會把這些值存成 0100 0000 1110 0000 1101 0000。
  • 3:57 - 4:03
    我們用 24 個二進制數字來表示一個像素點。不過相較於二進制,
  • 4:03 - 4:08
    藝術家更常使用十六進制數字系統來表示色彩,
  • 4:08 - 4:16
    所以我們可以表示用十六進制 40 E0 D0 來表示綠松石色,這樣子表示更精簡。
  • 4:16 - 4:21
    假設你想修改的圖片的顏色。你要怎麼做呢?
  • 4:21 - 4:26
    基本上有很多映射函式讓你可以輸入像素點的值。
  • 4:26 - 4:31
    所以你輸入紅R、綠G、藍B 的值後,就可以代表一個顏色。
  • 4:31 - 4:39
    然後你經過函式將 RGB 替換成新的值,比方說你想要製作一張偏暗的圖片,
  • 4:39 - 4:44
    就可以將原來 RGB 上的值分別減掉一個固定的數字,
  • 4:44 - 4:54
    比方說減 50。當然這個數字不能小於 0,我們把它們各減 50,
  • 4:54 - 5:01
    因此輸入的值是 R、G、B,但輸出後時就變成了 R-50、G-50、B-50,
  • 5:01 - 5:07
    這樣你就會看到你已經降低了圖片的亮度,而輸出的圖片就會看起來偏暗了。
  • 5:08 - 5:12
    大部分的人不知道 Instagram 是創先讓它變成篩選圖片的工具,
  • 5:12 - 5:17
    還有讓利用它來讓圖片變得酷炫或復古的,
  • 5:17 - 5:21
    更重要的是它的成長,
  • 5:21 - 5:23
    它變成了人與人聯繫的一種方式,
  • 5:23 - 5:27
    它不只是讓你看到朋友或家人的照片,
  • 5:27 - 5:31
    更能夠讓你探索在世界各地發生的所有事情。
  • 5:31 - 5:38
    無論是海外暴亂,一場社會運動,你都能夠以視覺方式獲取那些訊息,
  • 5:38 - 5:43
    這是我們能夠快速成長成為通用平台的原因。
  • 5:43 - 5:47
    學習更多在 studio.code.org。
Title:
Instagram 的 Kevin Systrom 解釋什麼是像素。
Description:

Hear Instagram co-founder explain how images are represented in binary, and how image filters work on the inside. This video is part of the Code.org video lecture series for the upcoming Computer Science Principles high school course. For more about the curriculum see http://code.org/educate/csp. For other educational videos from Code.org see http://code.org/educate/videos.

Special thanks to Kevin Systrom and Instagram and Piper Hanson photography http://piperhanson.com

more » « less
Video Language:
English
Duration:
05:50

Chinese, Traditional subtitles

Revisions