{"product_id":"swatch-sizing-and-shape-testament","title":"Swatch Sizing and Shape","description":"\u003cp class=\"task-lead\"\u003eA brand's color swatches and product photos weren't staying in sync, confusing customers about what they'd selected.\u003c\/p\u003e\u003ch2\u003eThe request\u003c\/h2\u003e\u003cblockquote\u003e\n\u003cp\u003eI need the color swatch selected to match the product picture and vice versa. Customers click a photo and the swatch doesn't update, or pick a swatch and the photo doesn't change.\u003c\/p\u003e\n\u003ccite\u003eOriginal customer request, anonymized\u003c\/cite\u003e\n\u003c\/blockquote\u003e\u003cp\u003eTwo-way sync that was missing.\u003c\/p\u003e\u003ch2\u003eThe approach\u003c\/h2\u003e\u003cp\u003eWe synced swatches and the gallery in both directions: selecting a swatch shows its photo, and clicking a photo selects its swatch. We also enlarged the swatches for clarity.\u003c\/p\u003e\u003ch2\u003eWhat we shipped\u003c\/h2\u003e\u003cul\u003e\n\u003cli\u003eTwo-way sync between swatches and gallery\u003c\/li\u003e\n\u003cli\u003eSwatches enlarged\u003c\/li\u003e\n\u003cli\u003eConsistent in quick view\u003c\/li\u003e\n\u003c\/ul\u003e","brand":"TaskHusky Portfolio","offers":[{"title":"Default Title","offer_id":44155715682378,"sku":"TASK-0439","price":0.0,"currency_code":"USD","in_stock":false}],"url":"https:\/\/www.taskhusky.com\/products\/swatch-sizing-and-shape-testament","provider":"TaskHusky","version":"1.0","type":"link"}