Простой и красивый интерфейс

Публикация № 1187700

Разработка - Работа с интерфейсом

Разработчики мобильных приложений на платформе 1С сталкиваются с проблемой адаптации сгенерированного платформой интерфейса под удобство использования. О том, какие приемы помогут сделать интерфейс красивым и удобным, на конференции Infostart Event 2019 Inception рассказал руководитель отдела мобильной разработки компании «1С-Рарус» Никита Бакшеев.

Всем привет, меня зовут Бакшеев Никита, я руководитель отдела мобильной разработки на платформе 1С в компании «1С-Рарус».

Мы разрабатываем программы, чтобы решить какую-то боль пользователя, принести какую-то ценность, помочь пользователям. Для себя мы, конечно же, хотим, чтобы наши программы были популярны, и, в конечном итоге, хотим заработать денег. 

Но мало кто знает, что 96% вновь выпущенных программ не используются совсем. Мы провели наше собственное исследование, и узнали, что в 2018 году у наших конкурентов было выпущено сотни программ, 96% из которых совсем не устанавливали. То есть, разработчики потратили свое время впустую.

Сегодня я вам расскажу, как сделать простой и приятный интерфейс, чтобы у вас были все шансы попасть в оставшиеся четыре процента.

 

О развитии мобильной разработки в компании «1С-Рарус»

 

 

И, прежде чем начать, немного о нас и о нашем опыте. 

  • Мы занимаемся только тиражной разработкой, только для массового рынка. 

  • На сегодняшний день наши приложения скачало уже более 2,5 миллионов человек во всем мире. 

  • 25 тысяч из них нам поставили оценку и написали отзыв. 

  • Средняя оценка у нас 4,5 балла. Это – очень хороший показатель для мобильного мира. 

  • Также больше 5000 человек ежемесячно оплачивает нам подписку.

  • Мы попадали в Топ-10 по категориям в 88 странах. Это – и развитые, и развивающиеся страны, такие, как Америка, Великобритания, Германия, Россия, Китай, Япония, Бразилия и т.д

  • Также нас AppStore выделял в свои подборки по категориям. Это – очень крутой показатель, многие разработчики хотят быть выделенными. 

По каждому из этих показателей мы являемся лидерами на платформе 1С.

 

Проблема интерфейса при разработке на платформе 1С

 

 

Расскажу про проблематику в целом. 

В мобильном мире, куда бы мы ни пошли, у нас, как правило, уже существуют тысячи конкурентов. Конкретно у нас, в зависимости от направления, от 1.5 тысяч до 20 тысяч конкурентов. Поэтому, если мы позволим себе сделать неприятный или неудобный интерфейс, то пользователь просто пройдет мимо – зачем он будет тратить на это время и силы, когда можно просто скачать другое приложение. 

А что в настольном мире 1С? Там не такая высокая конкуренция, там большой экран, поэтому критерий качества к интерфейсу там намного ниже, и разработчики особо не заморачиваются. Как правило, все сфокусированы на создании новой функциональности. Поэтому, когда настольная платформа переходила в мобильную, она по инерции перенесла туда все основные принципы и подходы. И если мы сейчас попробуем сравнить мобильное приложение на платформе 1С и нативное мобильное приложение, то мы увидим между ними пропасть с точки зрения интерфейса и удобства использования.

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

 

Уровни проработки интерфейсов

 

 

Мы делим проработку интерфейсов на 4 уровня:

  • первый уровень «Интерфейс платформы»;

  • далее идет «Адаптация экранов»;

  • потом – «Удобство использования»;

  • и последний, верхний уровень – «Идеальный интерфейс». 

Давайте теперь я про каждый из них более подробно расскажу.

 

Этап 1: Интерфейс платформы

 

 

Первый этап – это интерфейс самой платформы. Когда мы никак не дорабатываем интерфейс, платформа нам сама его сгенерировала. 

  • Посмотрите на первый экран. Мы увидим там так называемое «гамбургер-меню». Это меню морально устарело 7 лет назад. 

  • На втором экране мы видим стандартную форму списка, там выводится абсолютно ненужная колонка, первая колонка обрезается, тоже ничего не понятно.

  • А если посмотреть на третье окно, то это – форма документа с табличной частью. Там ничего не понятно, там весь текст обрезается. 

Естественно, так оставлять нельзя, это нужно адаптировать. Даже при огромном желании вы не сможете этим пользоваться.

 

Этап 2: Адаптация экранов

 

 

Поэтому второй этап – это адаптация экранов. И здесь у нас простая цель – сделать информацию доступной и читаемой. Сейчас я вам расскажу конкретные приемы. Они довольно простые.

Первый прием – это перенос текста. Это пример с формой списка, где обрезалась информация, и была ненужная колонка. Убрали ненужную колонку, перенесли текст, чтобы легче читалось – простой прием.

 

 

Второй прием – перемотка ленты. По инерции многие делают на экране несколько колонок, как в настольной 1С. Но на смартфоне экран маленький, соответственно, все обрезается. 

Не нужно делать колонки, нужно все располагать друг под другом. Информация будет представлена в длинной ленте, но это легко скроллится – это привычный жест для мобильного мира.

 

 

Третье – заголовки над или внутри поля. Тоже простой прием. По умолчанию у нас заголовок слева, а поле справа. В итоге на смартфоне не видно ни того, ни другого. 

Поэтому располагайте заголовок сверху, чтобы было видно и заголовок, и поле. Либо внутри. Но если мы располагаем внутри, то, когда мы выберем какой-то элемент, заголовок исчезнет. Поэтому выбирайте для разных случаев либо первый, либо второй вариант.

 

 

Четвертый прием – команды-иконки. Если мы будем так же, как и в настольной 1С, подписывать команды текстом, они у нас займут весь экран, поэтому – меняйте все на иконки. 

Тут два варианта – можно сделать иконку, и под ней мелкий текст (как на экране слева), либо просто иконки. Если они интуитивно понятны, это занимает мало места, удобно пользоваться.

 

 

Пятый прием – удаляйте лишние заголовки и команды. Платформа по умолчанию генерирует нам много лишнего, того, что вообще не нужно. 

Например, на экране слева нам и так понятно, где дата, где сумма. Зачем нам это дублировать? У нас маленький экран. 

Посередине – это стандартные команды, которыми никто не пользуется. Можно их смело удалять и не путать пользователя, потому что пользователь думает, что это – важно, начинает разбираться.

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

 

 

Шестой прием – меняйте шрифты, размерность, яркость. Фокусируйте внимание пользователя на всем важном. Убирайте внимание от всего неважного. Если пользователю будет нужно, он прочитает мелкий текст.

Вот – хорошие примеры, где мы меняем прозрачность, размерность. Эти формы гораздо легче читать.

 

 

Седьмой прием – несколько строк в формах списка. По умолчанию у нас платформа все делает в одну строку. Это приводит к тому, что, опять же, текст обрезается, и сами строки получаются очень узкие. Поэтому делайте несколько строк для одного элемента. И тогда строка становится выше – ее удобно кликать, и читается лучше – в экран помещается вся информация.

 

 

Восьмой прием – табличный документ на весь экран. 

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

Поэтому просто растягивайте табличный документ на весь экран. Это – простая операция, которая делает приложение гораздо симпатичнее.

Это был уровень адаптации экранов. Его, к счастью, в той или иной мере делают почти все, иначе просто невозможно будет пользоваться приложением.

 

Этап 3: Удобство использования

 

 

А следующий этап – удобство использования. Его, к сожалению, не делает почти никто. Либо делают частично и очень слабо.

Это – самый важный этап среди остальных. Почему? Потому что, если приложение понятное, удобное – им пользуются. У вас Retention будет хороший, и отзывы будут хорошие – а на базе двух этих показателей у вас начнут расти установки, которые конвертируются в деньги. От того, насколько мы сделаем приложение удобным и понятным, в принципе, зависит его успех.

Давайте я вам покажу, какие есть приемы повышения удобства использования.

 

 

Первое – добавляйте иконки к элементам и командам. Посмотрите на эти формы, у них есть иконки. И читать такую форму гораздо проще. Мы можем даже текст не читать, нам и так все понятно. Мы уже интуитивно очень легко воспринимаем такие формы.

 

 

Далее, есть прием «провести пользователя за руку» – когда мы его проводим по каким-то рельсам, не даем ему свернуть ни вправо, ни влево.

Здесь у нас представлено приложение «Питание». Это – индивидуальная диета для пользователя. Он отвечает на ряд простых вопросов и в конце получает свою персональную диету. Мы спрашиваем его пол, цель, ежедневную активность, вес и даем ему диету. Это – четыре простых вопроса, при ответе на которые он не может свернуть, никуда выйти вообще не может. Это очень легкие вопросы для восприятия, он за секунду на них отвечает и в конце получает результат. Это очень хорошо воспринимается пользователями. Когда мы так организовываем работу, этим очень легко пользоваться.

 

 

Третий прием – минимизируйте количество действий пользователя в приложении. 

Здесь представлено приложение для учета личных финансов «Бюджет». 

Внесение пользователем своего ежедневного расхода – самая частая операция в этом приложении. Человек пришел в магазин, купил молока – ему нужно занести этот расход. 

Что он делает? Он открывает приложение, нажимает на «Расход». По классике бы открылся документ, где куча реквизитов, которые нужно заполнить, кликнуть на реквизит, затем выбрать, затем нажать «ОК», чтобы реквизит заполнился. 

Вместо этого мы сразу же, не открывая документ, предлагаем ему выбрать статью расхода, минуя тем самым очень много кликов. Он выбирает статью расхода и сразу переходит в следующую форму, ничего не подтверждая и не возвращаясь к дальнейшему выбору реквизитов. Он вводит сумму, нажимает «ОК», и все – транзакция завершена, документ создан. Конкретно в этой операции мы сэкономили 12 кликов пользователя. 

Если это какая-то очень частая операция, мы, таким образом, можем сильно облегчить жизнь пользователю – он будет доволен, ему будет приятно регулярно возвращаться к приложению.

 

 

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

Классический пример – когда мы делаем реализацию товара, и нам система говорит: «У вас товара нет на складе, вы не можете провести документ». Что после этого обычно происходит? Пользователь начинает разбираться, открывает какие-то отчеты. Если он знает, в чем проблема, он сразу найдет, а иначе ему придется, может быть, даже несколько отчетов посмотреть, а только потом он решит, что нужно сделать инвентаризацию или купить товар.

И затем он возвращается в этот документ и проводит его. Зачем нам заставлять пользователя мучиться, когда мы можем прямо здесь в этой проблеме предложить ему оприходовать или купить товар. Вот такое мучение пользователя вызывает только желание удалить приложение и поставить единицу в отзывах. Больше ничего.

В наших решениях в таких случаях мы сразу же предлагаем оприходовать или купить товар. На экране справа – это решение проблемы до ее возникновения. Пользователь еще ни одного документа не вводил – он только заходит, и мы ему сразу говорим: «Этот документ вводится вот здесь». Чтобы пользователь не начинал напрягаться, исследуя приложение.

 

 

Пятый прием – сортируйте и группируйте команды. 

Как правило, у нас команд очень много. Есть правило Парето, когда 20% команд используются в 80% случаях. Поэтому – выделяйте на основном экране наиболее используемые команды (как на экране слева), а менее часто используемые команды сворачивайте в подменю, там можно иерархию организовать и т.д.

 

 

Шестой прием – нужно предзаполнять все, что возможно. Если мы можем про какие-то данные понять, как их в этом документе заполнить, это нужно делать. 

Например, на первом экране у нас документ «Бюджет». 

Эта плашка наверху – это не команды, это реквизиты, и они уже предзаполнены. Плашка внизу, где «Дата», «По всем кошелькам» – это тоже реквизиты. У нас здесь получается, что мы предзаполнили 70% документа сразу. 

Как предзаполнять? Есть разные приемы. Мы предзаполняем реквизиты либо на основе поведения самого пользователя, либо на основе поведения вообще всех пользователей, либо на основе каких-то данных в приложении. Например:

  • валюта «рубль» на плашке сверху заполнилась, потому что выбран русский язык;

  • поле «Месяц» заполнилось на основе популярности всех данных пользователей;

  • и поле «Расход» тоже на основе всех данных пользователей;

  • реквизиты «По всем кошелькам» и «Для группы расходов» заполнились на основании поведения конкретного пользователя.

Если мы будем каждый раз заставлять пользователя вводить данные, никто пользоваться не будет.

Второй пример – на основании этого же самого бюджета мы создаем расход. Мы на втором экране кликаем по бюджету и у нас открывается документ «Расход», экран №3. У нас там уже все заполнено, нам нужно ввести только сумму. Это удобно.

 

 

Седьмой прием основан на классической 1С-ной ошибке – заменяйте все сложные термины на простой понятный язык.

У нас пользователи в основном вообще не знают 1С, и мы некоторые 1С-ные термины заменили сразу. Например:

  • «Провести». Человек, который не знает 1С, никогда не поймет, что означает слово «Провести».

  • «Документ». Еще много лет назад, когда в 1С использовался этот термин, нас спрашивали: «Зачем тут вводить паспортные данные?» Все думали, что «Ввести документ» – это надо ввести данные паспорта. Поэтому замените «Документ» на «Операция».

  • «Записать». По сути, этот термин 1С означает «Сохранить в черновик». Поэтому лучше называть все своими именами.

  • «Пометить на удаление». Мне вообще не совсем понятно, зачем это может понадобиться в мобильном приложении. Удаляйте документы сразу же. Если мне кто-то скажет, что там есть проблема битых ссылок, то этот вопрос очень легко и красиво решается. Поэтому лучше удаляйте, не заставляйте пользователя удалять объекты через механизм пометки на удаление.

  • «Контрагент». Это тоже непонятное людям слово. Замените его на «Клиент» или «Поставщик» или другое слово, в соответствии с ролью. 

Это, конечно же, далеко не все термины.

 

 

Восьмой прием – нужно удалять все, что не используется, без раздумий и сожалений.

Потому что если есть какая-то функциональность, которая не используется, она будет усложнять использование приложения, потому что людям все время приходится с этим сталкиваться, а это уже дискомфорт для пользователя. 

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

Про основные приемы, направленные на удобство использования, я рассказал. Тоже, конечно же, не все. Но это – основные, которые мы выделили.

 

Этап 4: Идеальный интерфейс

 

 

А далее – идеальный интерфейс. Давайте еще раз посмотрим на интерфейсы, которые были на третьем уровне.

Как они выглядят.

 

 

А теперь давайте посмотрим, как эти же самые интерфейсы выглядят на уровне «Идеальный интерфейс», после того, как мы их перерисовали. 

У них точно такая же навигация, у них те же самые реквизиты. Но выглядят они гораздо приятнее.

Давайте посмотрим конкретно, как изменилась каждая из форм.

 

 

Это – форма упражнений.

 

 

Далее – форма приложения о питании.

 

 

Это форма первоначального опросника в приложении о питании.

 

 

Это – форма выполнения упражнения. 

Когда у нас был интерфейс слева, нам часто писали: «Вы там что, на Windows 95 разрабатываете?» А кто-то писал, что у нас дизайнер за хлеб работает :)

 

 

Так у нас изменился календарь.

 

Как сделать идеальный интерфейс

 

 

Но как мы это сделали?

Давайте я вам сначала расскажу про технологию в общем, как мы это делаем. И потом разберем конкретные примеры.

 

Шаг №1. Разработка дизайн-проекта

 

 

По технологии. 

Сначала мы делаем интерфейсы удобными – доводим их до третьего уровня. И после этого подключаем дизайнера. И он на основании стандартного интерфейса, когда в навигации уже все удобно, эти интерфейсы перерисовывает. На выходе мы получаем дизайн-проект.

Причем, дизайнера нужно брать, который не знает, что такое 1С. 

Почему мы доводим до третьего уровня на платформе 1С? Почему мы сразу не подключаем дизайнера с начала? Потому что на платформе 1С можно очень дешево и быстро прожить эволюцию интерфейсов – нам не всегда понятно, как сразу его сделать красиво и удобно. Поэтому мы много раз его перерисовываем на платформе 1С. Если бы мы с нуля делали все с дизайнером, то это было бы очень долго и дорого.

Поэтому эволюцию мы проживаем на платформе 1С и только потом уже делаем дизайн.

 

Шаг №2. Рисование интерфейса по дизайн-проекту в HTML

 

 

Далее, когда у нас уже есть дизайн-проект, мы передаем его программисту, но не простому программисту, а который знает и 1С, и HTML.

Он берет этот дизайн, рисует в HTML. И потом этот HTML он внедряет в платформу 1С. 

 

Примеры построения интерфейса на HTML в мобильных приложениях 1С

 

Давайте посмотрим на конкретном примере, как мы внедрили это в платформу 1С.

 

 

Здесь у нас форма упражнений. И, чтобы эту форму создать, нужно сделать HTML-документ, поместить его на форму и в событии «ПриСозданииНаСервере» эту форму описать. Вот так выглядит описание этой формы.

  • Первое – это URL-ссылка, которая вернется при нажатии на ту или иную кнопку.

  • Второе – это описание текста. Вот эти «Грудь, спина, плечи». 

  • И третье – это картинки справа. Вот так они присваиваются в HTML-документе.

 

 

Далее – мы оформляем эти плашечки-кнопки. Вот так выглядит оформление. Здесь мы присваиваем шрифты. Здесь мы говорим форме, как надо растягивать, какая там прозрачность, какой фон должен быть. Все это вот таким кодом описывается в событии «ПриСозданииНаСервере».

 

 

И нам остается только сделать обработку клика. Когда мы кликаем, срабатывает событие «ПриНажатии» в 1С. И в этом событии нам возвращается та самая URL-ссылка, которую мы вначале присвоили в событии «ПриСозданииНаСервере». И все, мы можем уже эту URL-ссылку обрабатывать, как хотим. Можем открыть другую форму, можем какое-то действие сделать. Все, что угодно мы можем сделать.

Этот пример можно будет скачать на Инфостарте, чтобы посмотреть, как это внедряется. Ссылка на пример

Я желаю вам создавать вам ваши идеальные интерфейсы и делать качественные продукты. Радуйте ваших пользователей, и это неизбежно отразится в виде крутых бизнес-показателей.

 

Вопросы:

 

  • Вы держите своего дизайнера или нанимаете каждый раз разного?

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

  • Как вы боретесь со скоростью запуска приложений на 1С?

  • Есть разные технологии. У нас в разных проектах по-разному. Что-то подгружается после установки, в фоновом режиме. Это зависит от конкретной проблемы. Но всегда можно оптимизировать. Либо мы сами данные оптимизируем, либо мы код рефакторим, либо просто подгружаем или обрабатываем что-то потом, уже во время запуска. Это все довольно стандартные приемы.

  • Где вы храните сами шаблоны (HTML, CSS) при проектировании формы? Потому что так получилось, что у мобильной платформы нет макета вида «Текстовый документ» или какого-то другого объекта, удобного для хранения текстов. Как вы из этого выкручиваетесь? Вы в коде забиваете текстовые шаблоны?

  • Это все хранится просто в макетах. Есть возможность создавать общие макеты – сохранять туда все, что вам нужно. Без разницы, какой там будет тип данных. На первых версиях мобильной платформы мы хранили данные в табличном документе. Создается обычный макет, в его первую ячейку вставляется текст, дальше оттуда восстанавливается. Либо это могут быть какие-то сборочные HTML – там, соответственно, делается какой-то архив данных, который потом разархивируется и запускается. Но это для сложных форм. А для простых форм текст HTML хранится либо в коде, либо в макете.

 

****************

Данная статья написана по итогам доклада (видео), прочитанного на конференции INFOSTART EVENT 2019. Больше статей можно прочитать здесь.

В 2020 году приглашаем всех принять участие в 7 региональных митапах, а также юбилейной INFOSTART EVENT 2020 в Москве.

Выбрать мероприятие

Специальные предложения

Комментарии
Избранное Подписка Сортировка: Древо развёрнутое
Свернуть все
1. lishniy 111 30.01.20 17:28 Сейчас в теме

Не знаю как остальным, но мне больше нравится то что слева. Безвкусица какая-то.
Хотя остальные вроде норм.
nekit_rdx; Flok; Трактор; DrAku1a; _alex1974; BARBAROSSA88; Sashares; TipsyKID; Interrupted; BigB; Идальго; logarifm; Artem-B; rpgshnik; dunpil; mirco; Somebody1; SinglCOOLer; +18 Ответить
6. rpgshnik 2114 31.01.20 09:56 Сейчас в теме
Публикация содержит хорошие рекомендации, хотя видео смотрел, но уже забыл :)
Но сам дизайн как заметили в (1) требует внимания :)
9. Baksheev-Nikita 502 31.01.20 11:50 Сейчас в теме
(1) Спасибо большое за мнение. Здесь соль не в том, кому что больше нравится, а в том что у вас есть возможность сделать ваш идеальный интерфейс, каким бы вы его не придумали, без каких-либо ограничений.

Что касается картинки для меня, если честно, это любопытный факт, что некоторым людям из 1С сообщества нравится больше именно левая картинка) Даже опрос захотелось сделать))) О вкусах не спорю, поэтому мы в своей работе опираемся в основном на объективные замеры статистик. Выдвигаем гипотезу -> замеряем -> внедряем. Среди целевой аудитории html интерфейс стал безоговорочным победителем и усилил многие наши бизнес показатели и удовлетворенность программой.

Кстати, регулярно мое мнение о прекрасном расходится с мнением пользователей, к моему сожалению. Конечно, внедряем то что понравилось пользователям в итоге.
nekit_rdx; Дмитрий74Чел; user1311038; +3 Ответить
29. _alex1974 06.02.20 11:38 Сейчас в теме
(1) фотографии негров, склеенные по вертикали - так себе, честно говоря
2. acanta 73 30.01.20 17:37 Сейчас в теме
Странно, почему в обычном интерфейсе так не делают, с наименованием внутри поля и дизайном.
3. Xershi 915 30.01.20 17:43 Сейчас в теме
Взял на заметку. Иногда бывают проекты по мобильной разработке, будет от куда почерпнуть идеи!
11. Baksheev-Nikita 502 31.01.20 12:00 Сейчас в теме
(3)(4)(5)(6) Спасибо большое, очень приятно, что доклад оказался полезным)
4. Torin 230 30.01.20 19:41 Сейчас в теме
Отличная публикация!!! Супер! Взял на заметку
5. LimarenkoA 31.01.20 08:47 Сейчас в теме
Очень хорошо всё написано, ни разу ещё не приходилось разрабатывать под мобилки, но тема крайне интересная и развитие в этом направлении имеет место быть.
7. Sergey_1c 54 31.01.20 10:12 Сейчас в теме
А как со скоростью работы? Раньше, помню, были очень большие проблемы с отзывчивостью интерфейса, открытие приложения - долго, смена экранов - с задержкой, скроллинг списков - просто ужас.
10. Baksheev-Nikita 502 31.01.20 11:56 Сейчас в теме
(7) Мое мнение, что на 1С интерфейсах в целом ситуация улучшается, коллеги из 1С работают над этим. Раньше точно было хуже. Но проблем, к сожалению, еще хватает. Хотелось бы чтобы их все исправили. А на HTML интерфейсах лагов нет вообще.
8. DarkAn 926 31.01.20 10:33 Сейчас в теме
Доклад хороший, но вот видео в разрешением 360 максимум - чет не очень :)
13. Baksheev-Nikita 502 31.01.20 12:03 Сейчас в теме
(8) Да, видео мне самому не нравится, я пытался повлиять на это, но это было не в моих силах. Какая-то техническая сложность(((
Спасибо вам за оценку доклада)
12. qwed557 30 31.01.20 12:01 Сейчас в теме
Кто придумал такой шрифт, мой мозг упорно пытался это прочитать на английском
Прикрепленные файлы:
DrAku1a; DWZ2; IllayDevel; BigB; +4 Ответить
27. Baksheev-Nikita 502 05.02.20 16:43 Сейчас в теме
(12) Шрифт выбрал дизайнер. ИМХО Красивый шрифт)
14. gudun_ku 60 31.01.20 13:05 Сейчас в теме
Исходя из шага 4, стоило сразу применять React Native или сейчас уже можно Flutter, и для таких приложений как подсчет калорий забыть про 1С, потому что зачем? Имхо мобильное приложение на 1с нужно тогда и только тогда когда нужна тесная интеграция с КИС на 1С, ну или логика работы "как в 1С".
15. Baksheev-Nikita 502 31.01.20 14:16 Сейчас в теме
(14) По поводу React Native и Flutter, может быть и лучше, но у нас просто нет в команде таких разработчиков, а HTML знаком многим и работает кроссплатформенно как и платформа 1С и интегрируется хорошо.

А по поводу забыть про 1С для приложения подсчет калорий не соглашусь. Звучит как стереотип. 1С платформа - это инструмент, если я могу быстрее и дешевле сделать на 1С платформе чем нативно, при этом с высоким качеством, то не вижу причин не делать. Это вопрос эффективности, хоть игры делайте на платформе, если есть возможность ее эффективно использовать для этого.
16. gudun_ku 60 31.01.20 16:38 Сейчас в теме
(15) Может быть и стереотип, да только ведь 1С насколько я понимаю, платная, в отличие от Android Studio, Flutter SDK и React ... А потом еще надо роялти платить...
17. FesenkoA 43 31.01.20 16:42 Сейчас в теме
Вопрос: сколько этот интерфейс создавался от "стандартная форма списка" до того что сейчас, и какой размер команды? Примерно, хочу оценить свои силы на создание чего то приближенного) Спасибо.
21. Baksheev-Nikita 502 03.02.20 16:25 Сейчас в теме
(17) У меня на этот счет есть целый доклад "Как сделать успешное моб приложение", вопрос цены и сроков там раскрыт, вот ссылка https://infostart.ru/public/1105397/
18. CheBurator 3410 01.02.20 00:34 Сейчас в теме
"Если мне кто-то скажет, что там есть проблема битых ссылок, то этот вопрос очень легко и красиво решается. " - как?
bulpi; СергейК; +2 Ответить
20. Baksheev-Nikita 502 03.02.20 16:21 Сейчас в теме
(18)
Предположим мы удаляем объект и на него есть ссылки в других местах программы. Там где мы можем просто очистить ссылки и при этом смысл другого объекта не утратится или строки регистра или строки таб части, то просто очищаем ссылки на удаляемый объект, там где очищение ссылки на удаляемый объект делает текущий объект/строку/запись уже бессмысленным, тогда и его сразу же удаляем вместе с удаляемым объектом, здесь можно уведомить пользователя, что будут удалены еще и вот эти сущности в программе.
28. CheBurator 3410 05.02.20 22:48 Сейчас в теме
(20)
Там где мы можем просто очистить ссылки и при этом смысл другого объекта не утратится или строки регистра или строки таб части, то просто очищаем ссылки на удаляемый объект, там где очищение ссылки на удаляемый объект делает текущий объект/строку/запись уже бессмысленным,

- как вот это процитированное определяется?
19. bulpi 169 01.02.20 16:21 Сейчас в теме
Вопросы новичка в разработке мобильных приложений :
1)"можно сделать иконку, и под ней мелкий текст (как на экране слева)"

Как ?

2)" это стандартные команды, которыми никто не пользуется. Можно их смело удалять"

Как ? Я их не делал, они сами появились. И как их удалить?

3)"Поэтому просто растягивайте табличный документ на весь экран. Это – простая операция"

Да ну! И как же это сделать?

4)"Если мне кто-то скажет, что там есть проблема битых ссылок, то этот вопрос очень легко и красиво решается. "

Это вообще классика. Я изобрел вечный двигатель и машину времени, легкота, а вы, лохи, все это время фигней страдали.
nekit_rdx; salexdv; DWZ2; +3 Ответить
22. Baksheev-Nikita 502 05.02.20 11:09 Сейчас в теме
(19) Отвечаю в том же порядке:
1) Вот здесь вы сможете скачать этот пример реализации: https://infostart.ru/public/923136/
2) Просто нужно убрать автозаполнение командной панели.
3) Нужно в макете нажать правой кнопкой на заголовок колонки и поставить флаг "Растягивать по горизонтали". В этом случае колонка будет пытаться занять все свободное пространство. Если у нескольких колонок активировать этот флаг, то растяжение будет зависеть от значения Весового коэффициента.
4) Ну я там ничего не изобретал, конечно и такой смысл не вкладывал. В общем в 20-м комментарии уже ответил на этот вопрос
nekit_rdx; chirinna; +2 Ответить
23. bulpi 169 05.02.20 14:24 Сейчас в теме
(19)

4)Так это почти аналог "удаления помеченных объектов" с поиском ссылок по всей базе. При нормальном размере базы может занять серьезное время.
26. Baksheev-Nikita 502 05.02.20 16:32 Сейчас в теме
(23) По удобству для пользователя это совсем не аналог. В классике пользователь вынужден мучится ручным обходом по всем докам, очень часто он даже не может сходу очистить доки от ссылок из-за особенностей учета. С точки зрения дизайна системы - это в прямом смысле издевательство над пользователями. В нашем случае пользователь нажимает удалить, дальнейшее очищение системы происходит автоматически.

По поводу серьезного времени - мы с таким пока не сталкивались. Возможно наши решения не очень сложные, чтобы воспроизвести проблему долгого удаления. Но если бы столкнулись, уверен есть способы оптимизации.
30. ejikbeznojek 16.03.20 13:29 Сейчас в теме
(23) Стоит избегать "нормальных" с точки зрения стационарных ПК размеров базы.
Я вот например в приложении для сканирования заказов гружу названия позиций которые нужно собрать, но номенклатуру при этом не создаю.
У меня при первом запуске создаётся пул элементов с галкой неиспользовать. А при каждой загрузке из этого пула берутся элементы, переименовываются и галки снимаются.
Получается что справочник номенклатуры у меня не пухнет и удалять объекты не нужно.
24. pun4er 05.02.20 14:52 Сейчас в теме
Статья хорошая, спасибо, плюсанул.
Подскажите, с помощью чего делаете прототип интерфейса?
25. Baksheev-Nikita 502 05.02.20 16:19 Сейчас в теме
(24) Спасибо за оценку доклада)
Illustrator + Figma + Photoshop
Оставьте свое сообщение

См. также

Мобильная платформа 1С 8.3: чтение СМС, журнала звонков и т.д. и т.п.

Статья Программист Нет файла v8 v8::Mobile Россия Бесплатно (free) SMS рассылки Мобильная разработка

Пишем приложение по учету личных финансов с загрузкой СМС от банков на основе мобильной платформы 8.3.15.62 ...

27.02.2020    2602    kras_71    7       

Новый раздел на Инфостарте - Electronic Software Distribution Промо

Инфостарт напоминает: на нашем сайте можно купить не только ПО, связанное с 1С. В нашем арсенале – ESD-лицензии на ПО от ведущих вендоров: Microsoft, Kaspersky, ESET, Dr.Web, Аскон и другие.

  • Низкие цены, без скрытых платежей и наценок
  • Оперативная отгрузка
  • Возможность оплаты с личного счета (кешбек, обмен стартмани на рубли и т.п.)
  • Покупки идут в накопления для получения скидочных карт лояльности Silver (5%) и Gold (10%)

Treemapping — способ визуализации данных древовидной структуры. Карта-схема дерева

Статья Программист Нет файла v8 1cv8.cf Бесплатно (free) Математика и алгоритмы Работа с интерфейсом

Предлагается ознакомиться с редким способом графического представления иерархических данных. Приводится алгоритм формирования и пример реализации.

18.02.2020    2589    randomus    18       

Цена победы, или Матчасть мобильного приложения "ТОИР Магнит"

Статья Программист Нет файла v8::Mobile Бесплатно (free) Мобильная разработка

Проект по созданию мобильного приложения «ТОИР Магнит» стал победителем конкурса 1С:Проект года-2018. В чем его особенность, рассказал участникам конференции INFOSTART EVENT 2019 Inception директор по маркетингу и продажам группы компаний «Деснол Софт» Сергей Ребрин.

04.02.2020    1467    RebrinSG    13       

Готовые переносы данных из различных конфигураций 1C Промо

Рекомендуем готовые решения для переноса данных из различных конфигураций 1C. C техподдержкой от разработчиков и гарантией от Инфостарт.

Динамический список. Апгрейд справочника "Номенклатура" типовой конфигурации с помощью расширения

Статья Программист Стажер Нет файла v8 УНФ Бесплатно (free) Практика программирования Работа с интерфейсом

В данной статье я приведу пример апгрейда справочника "Номенклатура" типовой конфигурации. В основе апгрейда лежат алгоритмы работы с динамическим списком на базе расширения конфигурации.

26.01.2020    3722    aximo    10       

Январский пак Simple UI: диаграммы и индикаторы, глобальные переменные,константы и многое другое

Статья Программист Бизнес-аналитик Нет файла v8::Mobile Бесплатно (free) Мобильная разработка

Очередной пакет дополнений к Simple UI направленный на средства визуализации, а также важные дополнения по части управляющих конструкций которых не хватало раньше. Теперь на Simple UI можно делать электронное табло, киоск или монитор, выводить индикаторы и красивую визуализацию. В пакет вошло: 3 вида диаграмм, стрелочные индикаторы, вывод картинок в контейнерах, глобальные переменные приложения, константы хранящиеся на устройстве, управление переключением экрана с сервера и то что в 1С называется "Обработчик ожидания формы". Протестировано на 1С 8.3.13.1865

20.01.2020    1436    informa1555    5       

Программы для исполнения 54-ФЗ Промо

С 01.02.2017 контрольно-кассовая техника должна отправлять электронные версии чеков оператору фискальных данных - правила установлены в 54-ФЗ ст.2 п.2. Инфостарт предлагает подборку программ, связанных с применением 54-ФЗ, ККТ и электронных чеков.

СКД. Шаг 3. Используем макеты для оформления отчета

Статья Программист Нет файла v8 v8::СКД 1cv8.cf Бесплатно (free) Работа с интерфейсом

В данной публикации рассмотрим базовый подход к использованию собственных макетов в СКД на примере формирования небольшого отчета.

13.01.2020    5695    aximo    13       

Базовый курс для начинающих 1С-программистов. Онлайн-интенсив со 2 июня по 2 июля 2020 г. Промо

Данный онлайн-курс является начальной ступенью по изучению базовых принципов программирования в системе “1С:Предприятие” и предназначен для обучения 1С-программированию “с нуля”.

4500-9500 рублей

Большой декабрьский пак дополнений Simple UI (Simple WMS): распознавание текста в обычных экранах и документах, отправка голосового сообщения на устройство даже в фоне и многое другое. Видео в конце поста

Инструменты и обработки Программист Нет файла v8::Mobile УУ Бесплатно (free) Мобильная разработка

Теперь распознание текста, которое тестировалось вот тут https://infostart.ru/public/1159499/ встроено в конструктор экранов и документов, а также многие другие новые возможности Simple UI.

11.12.2019    1938    informa1555    0       

[СКД] Вывод картинки в результат любого отчета на СКД

Статья Программист Нет файла v8 v8::СКД 1cv8.cf Бесплатно (free) Работа с интерфейсом

Если у вас в справочнике Номенклатура (или другом справочнике) заполнена картинка, то ее можно легко вывести для наглядности отчета.

09.12.2019    5850    1    John_d    16       

Онлайн-курс "Подготовка к экзамену 1С:Эксперт и 1С:Профессионал по технологическим вопросам" с 7 по 24 апреля 2020 г. Промо

На курсе вы получите практические навыки решения задач производительности 1С, в том числе характерных для высоконагруженных информационных систем (более 1000 пользователей). Подготовка к экзамену – только одна из составляющих курса. 70% слушателей приходят за знаниями, которые позволят расти и зарабатывать, делать сложные задачи на крупных проектах.

16450 рублей

Управляемые формы. Изменение формы списка или формы объекта без внесения изменений в типовые формы (без использования расширений)

Статья Программист Нет файла v8 1cv8.cf Бесплатно (free) Работа с интерфейсом

Вносим изменения в типовые формы объектов (документы, справочники, журналы, обработки, общие формы). Не снимая с поддержки эти формы. Создаем программно элементы из общего модуля. Для примера рассмотрю добавление колонки "Скрепка" в форму списка документа. Если к документу привязан файл, то в списке в новой колонке должна отображаться "скрепка".

12.11.2019    7502    John_d    23       

Бюджет-революция свершилась!

Статья no Нет файла v8 v8::Mobile 1cv8.cf Домашние учет и финансы УУ Бесплатно (free) Пользователю системы Финансовый учет и бюджетирование (FRP) Мобильная разработка

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

08.11.2019    4528    Baksheev-Nikita    14       

Базовый курс по обмену данными в системе 1С:Предприятие. Онлайн-интенсив с 12 по 28 мая 2020 г. Промо

Данный онлайн-курс предусматривает изучение механизмов платформы “1С:Предприятие”, обеспечивающих обмен данными между различными прикладными 1С-решениями и взаимодействие с другими информационными системами. Курс предназначен для тех, кто уже имеет определенные навыки конфигурирования и программирования в системе “1С:Предприятие”.

5500 рублей

Создание асинхронных виджетов

Статья Программист Нет файла v8 1cv8.cf Бесплатно (free) Работа с интерфейсом

Описание нескольких способов создания асинхронных виджетов для 1С:Предприятия. Рассматриваются способы с использованием HTTP-сервисов и фоновых заданий.

16.10.2019    8239    YPermitin    15       

Формы. Трудности программной работы

Статья Программист Нет файла v8 v8::УФ 1cv8.cf Бесплатно (free) Работа с интерфейсом

Рассматриваем основные подводные камни, с которыми приходится сталкиваться при программной работе с формами, а также способы обхода самых частых проблем.

06.10.2019    7800    YPermitin    21       

Подборка программ для взаимодействия с ЕГАИС Промо

ЕГАИС (Единая государственная автоматизированная информационная система) - автоматизированная система, предназначенная для государственного контроля за объёмом производства и оборота этилового спирта, алкогольной и спиртосодержащей продукции. Инфостарт рекомендует подборку проверенных решений для взаимодействия с системой.

Лайфхаки 1С (часть 1). Настройки отчетов и печатных форм 1С

Статья Программист Пользователь Стажер Нет файла v8 1cv8.cf Россия Бесплатно (free) Работа с интерфейсом

Статья рассчитана на пользователей или программистов, которые только начинают работать с 1С, для максимально быстрого ознакомления с интерфейсом программы. В статье приведены лайфхаки, которые позволят вам быстро и эффективно научиться настраивать отчёты и печатные в среде программных продуктов 1С. Полученные знания значительно упростят взаимодействие с интерфейсом 1С и повысят продуктивность работы оператора.

02.10.2019    9108    VachKirp    10       

Подборка решений для взаимодействия со ФГИС «Меркурий» Промо

С 1 июля 2019 года все компании, участвующие в обороте товаров животного происхождения, должны перейти на электронную ветеринарную сертификацию (ЭВС) через ФГИС «Меркурий». Инфостарт предлагает подборку программ, связанных с этим изменением.

Пример простого и приятного внешнего HTML интерфейса для мобильного приложения

Отчеты и формы Программист Конфигурация (md, cf) v8::Mobile Абонемент ($m) Работа с интерфейсом Мобильная разработка

Реализация простого и приятного внешнего HTML интерфейса для мобильного приложения. Делимся исходниками, чтобы разработчики мобильных приложений разрабатывали больше приятных интерфейсов для приложений.

5 стартмани

05.09.2019    4068    48    Baksheev-Nikita    12       

DevOps для 1С. Онлайн-курс проходит с 16 апреля по 11 июня 2020 года. Промо

Данный онлайн-курс предусматривает изучение процессов DevOps, их применение при разработке на платформе 1С. В результате прохождения онлайн-курса вы сможете: настроить ПО необходимое для проведения проверок и тестирования, создавать сценарии тестирования и объединять их в комплексные процессы, создавать скрипты для автоматизации процессов DevOps.

12000 рублей

[Механизм интерфейса] Часы

Статья Программист Нет файла v8 1cv8.cf Бесплатно (free) Работа с интерфейсом Практика программирования

Добавляем цифровые часы на форму, как бонус рассмотрим вариант и с аналоговыми.

26.08.2019    7403    rpgshnik    36       

Произвольная начальная страница через расширение (программно)

Статья Программист Нет файла v8 1cv8.cf Бесплатно (free) Работа с интерфейсом

Установка своей формы произвольному пользователю на начальную страницу.

14.08.2019    6822    nagaitseff    15       

Онлайн-курс «Автоматизация процессов управления МТО: методика сбора и формализации требований» с 1 апреля по 13 мая 2020 года. Промо

Цель курса - повысить полноту и качество сбора и формализации требований к автоматизации процессов управления материально-техническим обеспечением. Курс основан на процессном подходе, позволяет в полном объеме выявить и учесть все факторы, влияющие на специфику процессов управления МТО. Участники курса получают теоретические знания в области организации процессов управления МТО и готовый инструментарий для сбора и формализации требований по автоматизации этих процессов (шаблоны, опросники, модели).

40000 рублей

Как разработать успешное мобильное приложение на платформе 1С

Статья Программист Нет файла v8::Mobile Бесплатно (free) Мобильная разработка

Мобильные приложения становятся все популярнее, но многие программисты считают, что создавать их не сложнее, чем настольные. В итоге появляются продукты, которые не приносят разработчикам ни удовольствия, ни денег. Какие особенности надо учитывать при разработке мобильного приложения, в главное – как добиться, чтобы оно было прибыльным, участникам конференции Infostart Event 2018 Education рассказал руководитель отдела мобильной разработки на платформе 1С в компании 1С-Рарус Никита Бакшеев.

09.08.2019    7376    Baksheev-Nikita    7       

Подходы, методы и инструменты UX/UI для разработки эффективных интерфейсов на 1С

Статья Программист Нет файла v8 Бесплатно (free) Работа с интерфейсом Инструментарий разработчика

Интерфейсам в 1С обычно уделяют мало внимания. Это в итоге снижает востребованность платформы, делает ее неконкурентной, лишает большой доли рынка. Как не потерять старых клиентов и привлекать новых с помощью интерфейсов, а главное – как сделать «правильный» интерфейс, рассказал участникам конференции Infostart Event 2018 Education управляющий партнер и основатель консалтинговой группы WiseAdvice Иван Тягунов.

07.08.2019    7774    IvanAT1981    14       

1C:Предприятие для программистов: Расчетные задачи (зарплата). Онлайн-интенсив с 01 по 17 июня 2020 г. Промо

Данный онлайн-курс предусматривает изучение механизмов платформы “1С:Предприятие”, которые предназначены для автоматизации периодических расчетов, а именно - для расчета зарплаты. Курс предназначен для тех, кто уже имеет определенные навыки конфигурирования и программирования в системе “1С:Предприятие”, а также для опытных пользователей прикладного решения “1С:Зарплата и управление персоналом” и прочих прикладных решений, в которых реализован функционал расчета зарплаты.

4900 рублей

Форма отчета СКД

Статья Пользователь Нет файла v8::СКД 1cv8.cf Бесплатно (free) Работа с интерфейсом

Описание объекта ОбщиеФормы – ФормаОтчета.

01.08.2019    8258    vasilev2015    5       

Программы для исполнения 488-ФЗ: Маркировка товаров Промо

1 января 2019 года вступил в силу ФЗ от 25.12.2018 № 488-ФЗ о единой информационной системе маркировки товаров с использованием контрольных (идентификационных) знаков, который позволяет проследить движение товара от производителя до конечного потребителя. Инфостарт предлагает подборку программ, связанных с применением 488-ФЗ и маркировкой товаров.

Мобильный клиент 1С

Статья Программист Нет файла v8::Mobile Бесплатно (free) Мобильная разработка

Мобильный клиент 1С только начинает развиваться, поэтому в этой сфере больше вопросов, чем ответов. Но некоторые разработчики уже познакомились с его возможностями и преимуществами. Среди них - руководитель отдела разработок Bilist Дмитрий Шерстобитов, который дал коллегам несколько полезных советов, как работать с мобильным клиентом.

12.07.2019    17341    DitriX    32       

Пользовательские настройки системы компоновки данных

Статья Программист Нет файла v8 v8::СКД 1cv8.cf Бесплатно (free) Практика программирования Работа с интерфейсом

Работа с отчетами в пользовательском режиме, формы отчетов. Понятие пользовательских настроек в отчетах на СКД. Определение состава пользовательских настроек для разделов в целом и для отдельных элементов, для всего отчета и для отдельных группировок. Видимость функциональных опций в отчетах на СКД.

09.07.2019    15278    ids79    2