Chrome-расширение
Примерный вид для понимания


PSD имеется

Требуется

Использовать css фреймворк foundation. Либо предложить свой. Реализовывать компоненты фреймворком. ВАЖНО! Реализовывать не вокруг фреймворка а самим фреймворком.

Итоговая работа должна представлять из себя less файл с комментариями и структурирована по компонентно, html файлы: страница типографии (h1-h6,text,блоки,формы и тп), отдельно компоненты используемые в проекте (рейтинг, список эмоций, список подарков и тп), экраны согласно дизайну.
Изображения. Оптимизировать размер и качество под нужды проекта (в том числе учесть retina экраны). Отдельный спрайт по системным пиктограммам, спрайт по эмоциям, спрайт по подаркам. Спрайт организовать таким образом чтобы добавление новых изображений не требовало перестройки координат в стилях.

Поведение при изменении ширины - как на facebook. У всех элементов фиксированная ширина. Общая ширина 600 пикселей.

В отклике пожалуйста указывайте ваш опыт работы.