1)Photoshop: можно делать как анимацию gif, получится как на выложенной в вопросе картинке, но это скорее для демонстрации в портфолио или презентации. А для верстальщика лучше воспользоваться layer comp, для дальнейшей работы это будет более понятней, так как вся верстка будет в одном файле. Где вся графика будет отзывчивой, станет ясно, что происходит при нажатии на какой либо элемент или как ведет себя сетка при разных масштабах.
или edge animate)