⇚go home
4 posts tagged

portfolio

Страница Аспирантуры для pstbi.ru

Год назад я сверстал страницу Аспирантуры для Богословского института.

Страница подгоняет содержание под размер экрана:

По гайду, который я составил для Института, строка набора не превышает 700 пикселей. В строку в среднем помещается 7-8 слов. Так удобнее читать.

Конец.

portfolio   Верстка
Jul 25, 2015, 14:14

Система управления расписанием

Задача: Внедрить новый функционал в раздел Расписания, походу переделав панель администратора. 
Я начал с определения сценариев использования. После согласования сценариев с программистом и клиентом, я приступил к работе.

Файл со сценариями использования раздела

Первый экран — создание занятия

Чтобы не создавать занятие для каждой недели вручную, форма сама создает занятие каждую неделю до конца семестра.

Чтобы упростить ввод групп поле «Группы» подсказывает номера групп по ходу написания. А при клике на кнопку бутерброд показывает полный спискок групп.

Второй экран — список занятий

Занятия первого курса.

Пару слов о строке в таблице.

Чтобы применить изменения для последующих занятий, ставиться соответствующая галочка:

Отмена занятий

Если номер группы подчеркнут красным значит для этой группы занятие отменено. Чтобы отменить занятие нужно кликнуть на группу:

Общие отмены

Занятие для нескольких курсов и на длительный строк проще отменить в подразделе «Общие отмены».

Страница создания отмены говорит на человеческом языке.

Если в занятия отменяются всем курсам, то форма так и пишет — Все курсы. Так приятнее, чем вываливать список всех курсов.

Иерархия отмен
У нас есть два типа отмен: общая для курсов и конкретная для группы. Отмены имеют такую же иерархию как и стили в CSS. Общие отмены ниже отмен конкретных занятий. Это означает, что если снять отмену у конкретного урока, то она перезапишет общую отмену.

Удаление — принцип анду.

Пресловутый вопрос «Are you sure?» при удалении работать не будет. Поэтому я решил использовать принцип «Анду». Человек может вернуть удаленный урок в течении 30 секунда. После 30 секунд урок удаляется, а кнопка «анду» исчезает.

Сама кнопка удаления также появляется только при наведении на строку урока.

Пожалуй на этом все!

portfolio   ui
Jul 24, 2015, 16:37

Веб-форма денежного перевода

Задача была следующая:

Блюр для атмосферности.

В задании сделан упор на безопасность и удобство для бабушки и фрилансера. Поэтому в основе моей формы лежит идея кода-получения
Допустим вы отправитель.

После нажатия кнопки «Отправить» форма показывает, над чем думает.

Всего предусмотрено три этапа отправки.

Текст меняется после выполнения этапа
с «Проверка суммы на карте...» на «Проверена сумма на карте»;
c «Задержка денег...» на «30 000 руб. задержаны»;
после завершения последнего этапа «Генерация кода...» — показывается следующий экран;

Кнопка «Сообщить» активируется после начала ввода.

Человек завершает отправку денег переходом на главную страницу сервиса.

Форма на странице «Получение денег» предназначена получателю. Она кидает деньги на карту.

«Проверка кода...»
«Код проверен.»

Конец.

portfolio   ui
Jul 2, 2015, 9:41

Creating pstbi.ru

pstbi.ru

Orthodox St. Tikhon's Theological Institute — is a single-sex institution, that prepares guys to be ordained.

I had to create a website for Orthodox St. Tikhon's Theological Institute. At the beginning of the development process mistake was made by me. I continued working on the markup that was a heritage from the previous designer. This mistake led to a series of ugly shots. Below you can see different versions of the design, that I've made.

None of the accepted or declined versions satisfied me. I kept bringing designs to the client, hoping that he won't notice that there is already an accepted version so there is no need for another one.

Another way of presenting satisfaction shown before

Finely the client asked, ‘Arthur, why didn't you go with the first one? I think it's nice’. The first version was as terrible as it may be. So I answered that I can't go with it, but I'm going to wrap the designing up.

I googled websites of all major universities to see how big guys did it. They had a lot in common with the layout I was declining from thus shared the same problems.

So, on the last presentation the version, that I was looking for all this time, that I was finally happy with — was rejected. In fact, not only the client said no, but everyone in the room said no. Sadly, no arguments were found to protect the child at that moment.

That day, in the evening, I called the client and said something as this, ‘You know, I think we should accept the layout because if you are going to make a new logo, the layout I suggest will better except any shape of logos’,
‘Well, if you think so than ok’. That's how it was accepted.

I followed my colleague artists advise and made colors warmer.

So we started developing the layout I was happy with. Because the new composition is fresh and perspective for future development.

Working on this project was incredibly challenging, I was in a role of a project manager, designer, and front-end developer, at the same time. Plus I was studying and was working on a full-time job. So, yeah, it was hard and dangerous, but totally worth it.

I sometimes hear the client saying that by accepting this design he made the right decision. A happy client is an indicator of a good job.

Russian design
While I was writing this post I saw a poster that had two big mistakes which I was trying to avoid in this project.

I apologize for the photos bad quality.

Obviously designer thought that patterns and old Cyrillic font would make the poster look Russian and orthodox, but in reality it looks amateur, not interesting and nothing like Russian or orthodox. Of course, the poster has other reasons why it looks cheesy but it's a story for a different post.

Amen.

portfolio   Pstbi
May 2, 2015, 17:57
© Артур Кочарян, 2015—2017
Powered by Aegea