Above: a series of web ads (interrupters) meant to live throughout the site, linking to specific product categories. The interrupters inspire the customer and promote new products.

mobile homepage

desktop homepage

right: desktop | left: mobile

individual advice article pages: right: desktop | left: mobile

Above: a birthstone "interruputer" ad - promoting birthstone jewelry

When a product has various different gemstone color options, I provide special vector-made jewel toned swatcehs for the ux/ui options on the site as shown here. I drew these vector swatches in illustrator to have a gemstone photo-like effect, with the site-compatibility of a vector/svg format. The above screenshot shows my variant swatch-creation process.

right: mobile | left: desktop

screenshot of my interrupters batch development process in photoshop

right: mobile screen | left: batch process screenshot from illustrator (above), desktop screen (below)

right: mobile, image option 1 | left: desktop, image option 2

web page design process screenshot within Figma

right: desktop | left: mobile



email process screenshot of production 'slicing' within photoshop