uip-3.0-release

Друзья, это случилось — мы доделали редизайн! Теперь главные материалы размещены вверху страницы, в ленте отображаются большие картинки с наглядными стикерами, обзоры используют 100% пространства сайта, есть тренды, навигатор, удобные комментарии. На UiP 3.0 приятно глянуть и уже не стыдно показывать друзьям ;)

А вот как выглядел UiP 1.0 в 2008 году. Самый первый, сделанный на коленке студентами-айМаньяками после очередной киевской встречи пользователей iPhone.

UiP-1.0

Через год мы скачали новомодную тему Arras Theme и были просто на седьмом небе от счастья. Кто бы мог подумать, что она будет мозолить глаза аж до мая 2015 года?

UiP-2.0

Редизайн нам дался очень непросто — от первого концепта UiP 3.0 до запуска обновления сайта прошло больше трех лет (это еще одна причина, почему 3.0). Про количество напрасно потраченного времени и литраж выпитой непрофессиональными сайтоделами крови даже говорить страшно.

Решившись сделать новый UiP, мы допустили несколько критических ошибок. Надеемся, тебе наш опыт будет полезен. И ты уже не наступишь на эти грабли.

В далеком 2012 году у нас не было бюджета для привлечения серьезной компании, способной решить задачу комплексно. Дизайн разрабатывал наш читатель в свободное время, когда “душа лежала”. А мы не знали, каким должен быть новый UiP, и прошли через десятки вариантов чуть ли не каждого элемента оформления. Близкий к окончательному вид сайта появился только через полтора года.

prototype-1

Прототип UiP 3.0

uip-3.0-main

UiP 3.0 сегодня

Верстку сделали быстро и качественно (спасибо нашему другу Фоксу), осталось преодолеть программинг. Разыскали через знакомых якобы хорошего программиста, договорились про гонорар и сроки, он приступил к работе. Но не сложилось. Ситуация повторилась еще два раза — программисты брались за сайт, клялись-божились, что осилят. Но в результате очень долго двигались по ТЗ (которое с каждым разом становилось все обширнее и подробнее), начинали тянуть время и спрыгивали. На этом этапе мы уже были согласны заплатить какой-то компании за оперативный результат, но никто доделывать UiP 3.0 не хотел. А нам жалко было признать поражение и отказаться от проделанной работы.

Пару месяцев назад мы познакомились с Алексеем Фёдоровым, создателем студии Deco.agency. Он дельно покритиковал сайт (за что отдельное спасибо) и дал систему комментирования decomments — красивую и функциональную, не в пример круче Disqus. Сайт стремительно приобретал законченный вид.

Первый материал на UiP с широкой версткой: Обзор Apple Watch

Сайт не совершенен, мы знаем. Дизайн сегодня уже не так актуален, как во время его разработки. Да и мы сильно поднаторели в теме. UiP 3.1 появится скоро, в том числе и с твоей помощью.

Нам важно знать твое мнение про новый UiP. Что тебе нравится — от юзабилити и до цветов, что хотелось бы поменять. Говори как есть, не сдерживай себя. Чем больше фидбека, тем ближе мы к действительно классному UiP 3.1.

Теги:

UiP
piti4ek

Александр Питерман

Основатель и CMO
Руководитель проекта

Материалы

Нашел ошибку в тексте? Выдели ее и нажми Ctrl + Enter
  • Ребят, рад, что вы не опустили руки! Я с вами с самого начала!!!
    Ваша душевность, человечность и преданность делу подкупает! В то время, когда другие скурвились и испортились, вы остались в душе теми же «студентами-айМаньяками»! Так держать!
    P.S. Извините, если не по делу, просто эмоции =)) Отличный редизайн!

  • Поздравляю, ребят! Дизайн отличный, даже лучше, чем на рендерах, что я видел давным давно. Вы долго к этому шли. Еще раз, мои поздравления!

    • Спасибо, Егор. Ох же ш и долго шли)

  • Крутое обновление!

  • Отличный дизайн! Давно с Вами и рад, что Вы не сдаетесь!

  • pasyuk

    Сделайте, чтоб при клике на картинку можно было на статью перейти.
    Мобильной версии сайта (Responsive design) как не было, так и нет… стыдно должно быть, а еще 3.0.
    Часто перехожу на ваш сайт с твитера, поэтому, мобильная версия обязательна!
    Форма входа в комментариях странная и отключите дебагинг, чтоб не выскакивали ошибки для читателей типа «Warning: require(): Unable to allocate memory for pool. in …/web2/web/index.php on line 21″.
    А так дизайн норм, актуальный.

    • Привет. При клике на какую картинку?
      Мобилка есть, то, что она не открывается — баг, работаем над этим. Багов еще куча, на самом деле, будем очень благодарны за помощь в их поиске)

      • pasyuk

        На главной странице, под заголовками статей, картинки лучше сделать ссылками на статьи, а то целиться в заголовок тяжело. С мобилкой я погорячился.. работает. Очень тормозит сайт при прокручивании статьи — проц на 100% (Firefox, OS X)

      • Сейчас также тормозит? Уже кешер настроили нормально, вроде бы.
        Про картинки на главной подумаем, спасибо.

      • Саша, сайт (в мобильной версии так точно) виснет безбожно(((

  • Мне прошлый дизайн по душе, привычный, тут глаза не знаешь куда деть и что читать, не привычно, но может привыкну быстро

    • Прошлый дизайн даже слишком долго был с нами. В этом более удобная лента — большие картинки, большие заголовки, и крутая система навигации по содержимому сайта. Уверен, привыкнешь))

      • Возможно я Вас удивлю, но под wp, как и под другие решения, можно верстать то, что имеется, а не только ставить которые шаблоны.
        Впрочем, обновление неплохое, меня только верхнее меню смущает. Да и обводка выбора сортировки ни к чему. Так же не очень един общий стиль оформления. Например, в новостях изображений от края до края, а в перечне обзоров отступ громадный просто — рекомендовал бы поправить…
        P.S. Модуль авторизации через соц сети как-то медленный проводит.

  • Обожаю ребят, которые переступают через 100500 неудач и таки доводят начатое до конца. Знаю по себе, какое потом удовольствие и гордость просто вспоминать какую кучу проблем решили и что теперь имеем. Молодцы!!!

    Disqus или как его — круто, что убрали, наконец, каждый раз заглядывая в комменты, мечтал, чтоб это когда-то закончилось. Теперь — круто!

    Общий вид: первое впечталение — перегруженность. Реально, разбегаются глаза. Возможно, с непривычки. Посмотрим…

    Дизайн — плоско, бело… ну, наверное, так и должно быть, хз… хотя, нужно понимать, что это вроде как логичный шаг для ресурса о яблоках, но этот шаг также понимают ВСЕ онлайн магазины яблочных устройств и похожих ресурсов, ноги растут, естественно, от apple.com Т.е. появляется некая безликость. Яблочный ресурс? Значит серо-белый и плоский :)) Хотелось бы своей изюминки узнаваемой все таки…

    Ну, а вообще, безусловно, шаг достойный, нужно развиваться, меняться и новое всегда круто! Свыкнется народ ;)

    • Спасибо за поддержку)) Движение к простому дизайну — теперешний тренд, и мы от него никуда не денемся (да и не хочется). Но это не окончательная версия, UiP 3.1 будет лучше!

  • Нарешті мобільна версія не лагає в мене на старенкій 4ці.
    Хіба це не тема до вордпресу? В аналогічному стилі itc працює, я маю на увазі, обзори, чи iphones.

    Взагалі дизайн ок, поправте фотку до цієї теми, вона налазить на інші елементи сайту.

    Єдине, що мене завжди парить, за всі ці роки в мене не виходить правильно писати назву сайту з першого разу, це реальний провтик, що назва така довга, і коли руками набираєш, то чи помилку зробиш, чи iphones заміть iphone набереш, короче, домен би вам змінити, на uip.com.ua чи щось таке.

    Пс.
    З коментарями, просить авторизацію, навіть якщо ввів ім’я і імейл зверху в формі, або приберіть, або нехай працює і такий варіант, окрім авторизації з фб, вк, твіттером..
    і ще, додайте будь ласка можливість розтягувати вікно набору коменту. :)

    • Авторизация будет лучше, уже работаем над понятной формой

      • відкрийте сайт в файрфокс і долистайте до цієї статті, фотка залазить за межі гілки новин.

      • Можно скрин, плиз? Не могу воспроизвести.

      • Ось. Пс, ще в мене страшенно чогось лагають коменти, на опері також, на сафарі норм.

  • До нового дизайну потрібно буде звикнути, але прогрес теж вимагає жертв. Взагалі то Ви краще б україномовну версію додали. А то знову UKRAINIANiphone, а інтерфейс — кацапський. :(

    • Дело не в нежелании, а в возможности. Для украиноязычной версии нужна еще одна команда авторов. Пока ведем еженедельную рубрику http://ukrainianiphone.com/tag/weekly-news/, со временем добавим еще материалов

    • Кроме того, нас читают из многих стран (СНГ, США, Европа) и украинский понимают далеко не все.

  • Двигаетесь в верном направлении, друзья!
    Пара субъективных замечаний:
    1) Слишком много разделительных полос в верстке, выглядит грязновато :(
    2) Основной блок текста смещен влево, блоки с комментариями справа «угнетают и давят» при чтении статьи.
    3) У созданных комментариев отступы и переносы строк не сохраняются после публикации — тяжко читать.
    P.S. Вариант с широкой версткой статьи про Apple Watch выглядит намного лучше.
    По визуальному стилю я бы посоветовал двигаться в сторону простоты и лаконичности Medium.

    • Часть полос уберется, как и сложные графические элементы — сами уже не в восторге. Комментарии тоже пофиксим. А вот про «Основной блок текста смещен влево, блоки с комментариями справа «угнетают и давят» при чтении статьи.» не очень понятно. Распиши подробнее плиз

      • По поводу блока прикрепил скриншот, при наличии свободного места по бокам неплохо было бы отцентрировать сам блок с текстом статьи!

        P.S. Спасибо за отличный контент :)

      • Прикрепил не ту картинку, вот нужная

      • Небольшой баг с кнопочкой X. Chrome 42 на OS X

      • по непонятной причине прикрепилась опять не та картинка (я уверен что выбрал нужную).
        Пробую еще раз:

      • в них кругом, де крестик їх два, якщо +1 до свого коменту зробити, теж повідомлення з таким крестиком випаде.

      • Какой браузер, какая система? У меня на Safari и Chrome (OS X) не воспроизводится

      • Chrome 42, OS X

      • файрфокс, осх йосик також

  • Зашел на ваш сайт и аж в слух сказал: «*б твою м*ть»)
    Извините за мат, но было именно так)
    Отличный дизайн!) Красавцы!

  • Спасибо за обновление — выглядит свежо и в духе времени :) Правда, теперь сайт очень похож по стилистике на itc.ua… Возможно, в 3.1 нужно поработать именно над поиском индивидуальности.

    По своему опыту знаю, что переход на новый дизайн никогда не проходит гладко, т.ч. могу пожелать только терпения, крепких нервов и удачи!

    Из замечаний: мобильная версия вроде бы появилась, но я так понял, что сильно лагает — ждем исправлений. Спасибо)

    • Спасибо за отзыв! :)
      Зачем вы нас так обижаете? Ну как это похож на itc.ua? Скажите, что вы пошутили, пожалуйста:)
      Да, возникло чуть больше проблем, чем мы могли себе представить, пытаемся их решить asap.
      Мобилка еще глючит, да. Копаем.

      • на счет itc субъективно, конечно, хотя кто-то тут тоже писал об этом — значит что-то есть :) еще +1 к тем, у кого «тормозят» комментарии: OS X, Chrome.

  • [decom_attached_image_1431075920469]

    • Сайт очень хорош. Сильно нравиться. Но вы просили комментарии. Не авторизованный читатель видит как соотносится граница статьи с «прикрепленной полосой»…

  • Добавьте иконку к фейсбук приложению

    • Где это и что это? Можно ссылку и скриншот или объясни как туда попасть?

  • Редизайн хорошо, но продуманный редизайн лучше. Какие моменты конкретно для юзера вы решили? Навигация ок, но к сожелению текст КАПСОМ не читается (нужно леттер спейсинг делать больше). Развал по фокусу в ленте. Я не могу сфокусироваться ни на чем, потому как слишком много елементов, которые вы хотите выделить (нельзя выделить одинаково сразу несколько елементов, потому что в итоге выйдет что не выделен ни один из них).

    По внешнему, правый блок слишком прибит к основному. Слишком контрасные разделительные полосы. Поиск вообще потерян. Еще куча работы. На предыдущей версии лента была удобней. а так молодцы, что развиваетесь.

    • Спасибо за отзыв, учтем в UiP 3.1

  • Ilya Mikhailov

    Отличный редизайн, поздравляю!
    Только ан Win7 в Хроме подтормаживает знатно при прокрутке.
    На MacOS перепроверил в Сафари, все ок.
    Плюс не сильно нравится голубой цвет (который на фавиконе и лента на главной странице). Но это уже чисто субъективное)
    Комментарии теперь только через соцсети? Пытался по email зайти, не дает.

  • Ну что за…? Пит, ну серьезная же компания.
    Хедер:
    — когда незалогинен, то он вроде как минимайзится и липнет к браузеру, но корявенько.
    — когда залогинен пропадает.

    Ну в целом канеш красавцы! Маякнул бы мне, нашел бы тебе и верстку и девов :)

  • Очень круто, дождались! Так держать;)

    • Единственное, что сейчас режет глаз, это кнопочка «дальше»… Хотя думаю 3.1 все поправит:) По стопам Apple :D

  • Круть….мне нравится! Дизайнерам, верстальщикам, респект. Займитесь теперь оптимизацией…тормозит интерфейс :)

    • При каких действиях тормозит?

  • Только вот проблема есть. В статьях внизу предлагаются другие статьи в разделе «Материалы», но при нажатии на них открывает текущую страницу. В широкоформатных статьях нет кнопки «To top». Когда логинишься для отправления комментариев вверху появляется фиксированная полоса от WordPress и перекрывает фиксированное меню. И иногда эта статья отображается в формате для мобильных устройств. Ещё не нравится то, что когда «плюсуешь» чей-то комментарий остаётся возможность снова нажать «плюс». Т.е. «плюс» и «минус» не начинают отображаться как-то по-другому. Сделайте так, что допустим при нажатии на «плюс» он будет потом светиться зелёным фоном, а минус будет более светлым.

  • Не знаю, как бы это объяснить… но дизайн какой-то рубленый, что ли.
    То, что смущает: кнопки главных материалов хотелось бы сделать одинаковыми по ширине (кроме поиска и логотипа сайта);
    (На скриншоте) если сделать главные новости в один ряд, будет место экономить и поэстетичнее выглядеть;
    Распределение потока новостей по страницам (как в поиске в Яндексе, предположим), на мой взгляд, куда удобнее, чем единым потоком (загрузить ещё). На сайте MacDigger та же ситуация: нужно найти статью на сайте, а вот фиг тебе — листай двести лет.
    Пока что всё:)

    • Если нужно найти статью и знаешь, когда она была опубликована — используй календарь в боковой колонке. Плюс есть толковый поиск =)

  • Пит, отличный дизайн. Да, старый кажется привычным так же как и Mavericks первое время казалась более привычной чем Yosemite. Еще раз — отличная обнова)
    И хочется очень увидеть приложение для ios или хотя бы мобильную версию… верю у твоей команды это получится)
    да, и еще, смотрю после авторизации пропала панель с кнопками сверху при прокрутке ленты :(

    • сайт адаптивный.

    • Антон, спасибо! А я привык за секунду, когда та старая развалюха перекочевала в корзину:)
      Мобилка есть, уже работает корректно.
      Можно скриншот пропавшей панели, плз? Кстати, картинки можно загружать прямо в камменты теперь.

      • [decom_attached_image_1431101247523]

      • Отсутствую кнопочки, приходится выходить после комента. На iPad сайт выглядит просто охренительно. И кстати я тоже уже привык к этому дизайну.

      • Пит, прости, все гуд, нужно было в wordpress выключить отображение этой панельки:) просто ж хочется как всегда из «коробки», а не копаться в настройках.

  • В целом не плохо. Но можно было и лучше)))) на телефоне некоторые запчасти мелковаты. Не привычно, но через неделю все забудут каким сайт был раньше и все будет хорошо. Спасибо за адаптивнось.

    • Сами знаем, что можно было лучше. Теперь дело за малым.
      Был бы благодарен за более детальное описание неудобства мобилки и не только, чтобы мы могли это исправить.

      • Не нажимаются кнопки. Например, те же самые комментарии: попробуй ответить кому-нибудь или хотя бы поставить плюс даже с айпеда — действительно неудобно. И грузятся страницы долго.

  • Вы конечно молодцы, но к сожалению получилось говно. Увы, но это говно, как для 2015 года. Без обид.

    • Спасибо!

      • Не за что его благодарить! Абсолютно не информативная и не объективная критика.

  • smile437

    Только у меня эта страница лагает при прокрутке?)

  • Сайт в каких-то очень ярких тонах. Сижу на сайте с 2011 года и могу сказать, что прошлый дизайн был более спокойный и удобный. Конечно, мы привыкнем к этому, т.к. человек привыкает ко всему. Да, дизайн сделан неплохо, но не для вашего сайта. Еще он работает медленее сами прокрутки страницы из-за большой нагружености и навигации страниц. С айфона (5s) выглядит страннова-то и не очень удобно. Думаю, вам бы не помешала мобильная версия сайта

  • Саша, Йонас, привет.
    По сайту,
    Дизайн — штука субъективная, привыкаешь. В дизайне как-то непонятна центральная полоса с контентом, а по бокам серая пустота.
    Что еще сильно не понравилось — сайт тормозит. Причем ощутимо тормозит. Win 7 64x, i7 2600k, 16 Gb ОЗУ, и все равно как-то оно рывками скроллится, отображается, в независимости от браузера (Fx 37, IE 11), пофиксите как-то это плиз, ибо просто невозможно пользоваться сайтом.
    И да, как картинки прикреплять к комментам, чото я не понял?)

    PS. И еще. Форма комментариев не позволяет форматировать его, т.е. комментарии идут сплошным текстом, а хотелось бы абзацем каким-нибудь отделить одну мысль от другой.
    PS2. И еще я авторизовался через ВК, а форма коммента не подцепила имя, только id. (Шершнёв Алексей, ваш старый постоянный читатель :)

    • Привет, Леша! Замечания принял, работаем =)

    • Форма комментариев не позволяет форматировать его, т.е. комментарии идут сплошным текстом

      — какой браузер, система? А то у меня есть абзацы

      • Ага, комменты и форму авторизации в системе комментирования пофиксили, теперь форматирование есть и имя человеческое :)
        Но тормоза сайта остались.
        Причем я специально проверил, на эпплах — все плавно и быстро, а на винде, не важно какой у тебя браузер или сколько гигагерц в процессоре с гигабайтами на маме — все равно тормозит.

      • Похоже природа сайта бунтует =))) Но фиксить будем!

    • Тормозит наверное из-за CSS3 анимаций. У меня так всегда в Safari на Mac OS тормозит, когда анимация на CSS3, а не jQuery. В Chrome всё отлично. Тоже иногда замечаю тормоза на сайте. Особенно когда начинаю быстро листать комментарии

  • Саша , я ждал обновления дизайна очень давно . С тех пор как ты мне ответил : «скоро» прошло 2,5 года по-моему.

    Есть пару замечаний :
    -Ночью ядово-зеленые кнопки жгут глаза.
    -хотелось бы Disqus-комментарии (привычка и удобство)
    -на стареньких ноутбуках ( рабочих) при прокрутке сайт притормаживает.

    • Над цветами поработаем, много их)) А Disqus уже не вернется, эти удобнее и функциональнее

    • на маку з i5 теж ця сторінка підвисає при прокрутці :-/

    • Я тоже за старый добрый Disquis

  • Ребят вы супер!) давно ждал новый свежий дизайн сайта, и огромное спасибо за мобильную версию!)))

  • И сделайте уже переход на статью по клику по фотке, слишком уж гигантские эти фотки к статьям, чтоб под ней выискивать малюсенькое слово «дальше». Не удобно :))

  • Обилие комментариев или что, но как только опускаю статью к комментам, просто зависает страшно, скроллится очень туго, рыками и никуда больше не выходит двигаться, страшно тормозит. Ctrl+F5 решает вопрос, снова все бегает отлично, но стоит спуститься к комментам — тормоза… :(

  • Норм дизайн :-)

  • Привет, UiP. Очень ценю ваш труд над созданием контента для сайта. Вы молодцы! Настоящие фанаты своего дела! Может быть когда-нибудь мы с вами познакомимся поближе и будем дружить…
    По поводу дизайна:
    * Минималистично, и от этого ХОРОШО!
    * Мне нравятся виджеты с обзорами в сайдбаре
    * Зеленый цвет кнопок я бы немного изменил, очень режет глаза
    * Страницы с большим количеством комментариев очень сильно лагают при прокрутке
    * Как по мне шрифт верхнего меню как-то не очень
    * С мобильным шаблоном все нормально: быстро — информативно — чистенько
    * Уберите календарь из сайдбара. Кому он тут потребовался??? Вот сейчас возьмите и уберите!!!

    Ну а в общем, молодцы что пытаетесь улучшить свой проект. Еще пару косяков допилить и все будет ОК. А хейтеры всегда будут, так что не особо расстраивайтесь когда вам гадости пишут.
    Держать хвост пистолетом!

    • Без календаря нельзя, у нас ведь страниц нет — посты подгружаются в одну ленту. А так можно быстро перейти на нужную дату

  • mydecember

    подтормаживает пока это всё дело. но в общем ничего.
    хотя теперь баннеры вроде шары дня как-то глаза выедают, когда стали больше места занимать на экране — кричащие цвета желательно немного «успокоить».

    c комментариями странно — без регистрации не работает почему-то.

    ну и самое главное — от Украины в лого ничего не осталось(( хотя можно было бы и обыграть ненавязчиво ту же точку над «i», раскрасив её национальными цветами.

  • у меня жудко сайт тормозит при прокрутке вниз и вверх … иногда спасает обновить страницу… но не сильно.. просто тормоза становятся меньше но не исчезают. и банеры шары дня действительно за слишком большие … а так ничего … респект! Так держать!

  • Не знаю почему, но после редизайна сайт начал нормально работать в Китае ;)

  • romarikk

    Сделайте пожалуйста так, чтобы при открытии новости текст размещался бы на весь экран, ведь по бокам еще полно свободного места!

  • Дизайн просто отстой!!!верните все как было!!!

  • Дуже «тяжкі» сторінки у новому дизайні. Зависає при перегляді, особливо де багато коментарів.

  • Новая система комментариев какая-то странная — вроде и подписываешься на сообщения и ответы, а все равно ничего не приходит.

  • Сайт стал ну оооочень долго грузится! С инетом у меня вся в порядке 100Mbit, но что на ноуте, что на телефоне не реально читать! На iPhone 4S часто просто сафари вылетает, а когда хоть как-то загрузится, листаю вниз, а там серая страница и опять жду!

  • Pingback: Как читать UiP с iPhone()