照片的邊緣並不均勻：亮部可能融進背景，暗部又形成過重的輪廓。頭像重疊後，還多了照片與照片之間的交界。
我會先處理單張圖片的收口，再決定群組的寬度、分隔與入口。外圈和內緣各有工作，不能靠加粗同一道線一次解決。
本文由原篇重編並擴充。試樣數值代表當時條件，並非所有介面的固定規格；系列脈絡與工具入口見 總論。
圖片與交界
把一道淡輪廓覆在圖片裡
圖片靠近外緣的內容，可能一邊接近白色，另一邊又很深。放進面板時，亮部容易與底色融在一起，暗部則自己形成一條強邊。我喜歡用一道內縮輪廓（inset outline）把這些不同分量的邊緣稍微收住。
這裡把 1 px、10% 不透明度的純黑輪廓覆在圖片內側，尺寸、裁切與圓角都不變。輪廓會與原本的像素疊合，亮部的變化比較容易看見；它交代的是圖片的收口，外面仍可另外安排容器。
換到暗色容器，試樣改用相同寬度與透明度的純白輪廓，讓靠邊暗部有很薄的交界。兩張圖裡使用相同的原創圖面，方便把注意力留在邊緣。
圖片本身用 R12，周圍 8 px 的底由 R20 容器包住。內縮輪廓畫在已經裁好的圖片裡，不占額外空間；外部容器的間距則照原來的排版計算。這種處理比較適合有完整矩形邊界的照片、截圖和圖面。透明標誌與不規則插畫，可以讓原有輪廓保留呼吸空間。
頭像與入口
頭像重疊，先看省下多少空間
多位參與者放在一起，可以排開，也可以局部重疊。頭像群組（avatar group）交代有哪些人，頭像堆疊（avatar stack）則用重疊縮短整組占用的寬度。我會在緊密的資訊列裡使用堆疊；需要逐一辨認每張臉時，分開排列與姓名可以留更多空間。
這組用三張原創虛構人像比較：圓形框體都是 32 px，左側相鄰間距 6 px，右側重疊 8 px。照片、裁切、圖片內緣與 2 px 外側分隔圈全部固定，兩組也從展示槽裡相同的位置開始，垂直中心一致。
三顆的排版寬度因此從 108 px 縮到 80 px。外側分隔圈不占排版空間，但會在左右兩端各多畫 2 px，所以繪製範圍分別是 112 px 與 84 px。這些數字限於本圖的三顆等尺寸圓形與無實體邊框配置，放進容器時仍要留意外圈是否被裁掉。
暗色版本沿用相同排列，只讓邊緣配合所在表面。這是用來拆解排列的概念對照；最後工作區本來就使用堆疊，仍維持 22 px 頭像與 5 px 重疊，沒有為了示範把整列撐大。
外側分隔與圖片內緣，各做一件事
重疊之後，兩張照片容易在交界處黏成一塊。外側的分隔圈（separation ring）用所在表面的不透明顏色，遮開交疊的位置，留出可辨認的空隙。它不負責墊高頭像；我會讓這圈空隙融回承載面，交疊處仍看得出各自的圓弧。
這也是分隔圈需要跟著狀態改變的原因。白色卡片、已選取的資料列與暗色表面，底色各不相同；固定白圈放到暗面，就會多出一圈不屬於背景的亮邊。碰到透明或圖案背景，單一顏色無法還原下面的內容，需要真正的遮罩挖空，或改成不重疊排列。這組操作試樣在圖案底選擇排開。
照片內側則沿用前面的內縮輪廓，用圖片內緣線（image inner stroke）修整照片本身。下方兩組固定同樣的堆疊與外圈，亮色只比較有無 1 px、10% 純黑內緣。細線覆在已裁好的照片上方，沒有縮小圖片，也沒有把外圈加粗。
暗色的內緣對照改用 1 px、8% 白色。這裡用圓形容器上的裝飾層覆到照片前方；直接把內陰影放在不透明圖片背後，未必能看到同樣的效果。我喜歡讓這條線只在靠近邊緣時被察覺，中央的臉和裁切維持原樣。
人數多時，留下可用的入口
可見頭像和真實人數也要分開安排。這組原型保留四個槽位，七人時顯示三顆加 +4，四人時就是四顆；照片載入失敗，縮寫或缺省圖形仍占相同尺寸。數字與圖片都不應讓圓形忽然變大。
需要查看完整名單時，我會讓整組頭像開啟參與者清單，讓姓名在有空間的地方讀清楚。重疊的小圓形若各自擴成點按範圍，容易蓋住彼此；清單裡再安排分開的操作列，鍵盤開啟、關閉與焦點返回也比較明確。可以在操作試樣切換表面、排列、人數與圖片失敗狀態，分別觀察外圈和內緣的工作。
圖片內緣負責收口，外圈負責分隔，溢出入口負責讓人找得到完整名單。把這三件事分開檢查，才能在群組變長或背景改變時，保留辨識與操作所需的空間。