Negur Design

Мои знания Я имею знания в разных смежных направлениях, изучаю что-то новое по работе и/или что хочу знать.

UX/UI Смотрел курс по UX/UI дизайну
[Максим Кузнецов] UI/UX дизайн курс (2022) link2
Курс занимает 8 гигабайт. Многое я знал, что-то новое вынес для себя.
По курсу создавал UX-артефакты в Miro: Site map, User Flow, Functional map
Читал книги:
100 главных принципов дизайна. Как удержать внимание.
С. Уэйншенк - 100 главных принципов дизайна (Библиотека специалиста) 2012
Сьюзан Уэйншенк - 100 новых главных принципов дизайна 2016
Дизайн привычных вещей. Дон Норман
Не заставляйте меня думать 3-е изд. Стив Круг
Выйди из зоны комфорта. Брайан Трейси
Статьи:
Как провести UX-исследование самостоятельно: 6 проверенных методов
Как провести A/B-тест сайта: инструменты и популярные гипотезы
Полное руководство новичка по UX исследованию
7 конечных результатов ux: что я буду делать в качестве ux-дизайнера
Как мы делаем проекты: проектирование и прототипирование
Как создать User Story, сценарии и кейсы
Мобильные UX-паттерны, которые используются неправильно
Что такое гайдлайны мобильных приложений и зачем они нужны?
Анаит Бадалян — «Психология как инструмент дизайнера», UX-марафон
Комплексное руководство по дизайну мобильных приложений
Пользовательский опыт: все, что нужно знать продакту
Пользовательские сценарии: что это такое, как и для чего их нужно строить
Тестирование прототипов при разработке программного продукта
Дизайн-система: что это и в чем ее ценность для продукта и экосистемы | Глава 1
Создание дизайн системы — пошаговое руководство | Глава 2 Изучал принципы Material design * * iOS * IxD Могу выполнять задачи по Interection дизайну: интерактивности при взаимодействии с различными элементами интерфейса, как на сайтах, так и в мобильных приложениях и других интерфейсах. Изучал разные программы проектирования прототипов, в которых можно делать интерактивности. Могу делать lottie анимации, motion дизайн в After Effects, Adobe Animate, GWD и других программах. Пример видеоурока: What is Interaction Design? Learn Interaction Design in Product Design like a Pro!

Графические программы и прототипирование

Lucidchart * Miro * Balsamiq * Marvel * > Flinto * > Principle * >
Figma * Abode Xd * Sketch * InVision * * Axure * Framer * > >
Делал в Framer страницы во время изучения Spline:
How to Easily Design a Glass Cube in 3D with Spline, делал сцену в Spline и добавил её в Framer
  Spline 3D Images in Cubes Framer
Build an interactive 3D scene implemented on a ReactJS site using Figma and Spline, делал сцену в Spline и добавил ее в Framer
  Spline 3D Room у Framer
Designing a 3D website with Spline and Framer, делал по нему
  Адаптивная страница в Framer

Photoshop * > Примеры обработки изображений в фотошопе с AI Illustrator * > > > > > Lightroom Classic * > CorelDRAW * Mockflow * Zeplin * >

AI Тестировал нейросети:   Мой анализ с изображениями 10 доступных графических нейросетей по одному запросу "txt to image".
Этот анализ нейросетей я делал летом 2023 года, поэтому в нейросетях появились изменения.
1. Open AI Dale тестировал, результаты не такие выразительные, как у других бесплатных, вроде бы платная но снова есть лимит.
2. Discord Midjourney нравится, платная. Изучал на тестовом аккаунте, сейчас он закрыт. >> >> app.fengmyshui.com >>
3. Discord BlueWillow бесплатная, не такая хорошая как Midjourney, иногда хорошие результаты, иногда слабые. * >> >>
4. Leonardo.AI бесплатная, быстро заканчиваются токены, где-то 4 генерации по 4 изображения в сутки >> >> >> >> >> >>
5. Stable Diffusion локальный и внешние серверы: >> много тонких настроек для генерации изображений. >> >> >>
Изучал разные видео, тестировал настройки, генерировал изображения. Используются специальные модели, позволяющие лучше генерировать нужную графику. Устанавливал AbsoluteReality на StableDiffusion * >   Мои примеры AbsoluteReality на StableDiffusion
6. Easy Diffusion v2.5 7. clipdrop.co/stable-diffusion * >> генерирует быстро, 3 результат по 4 картинки, бесплатный суточный лимит.
8. stablediffusionweb.com бесплатно генерирует долго 512 пикселей, 30 сек., от загрузки, ограниченные размеры, есть разные стили.
9. fusionbrain.ai * генерирует быстро бесплатно 1024x1024 достаточно качественные изображения. >>
10. replicate.com генерирует быстро, делает ошибки, размеры до 1024, бесплатно. Другие >> генерируют 3-5 мин.,неточные результаты.
11. Photoshop 25.0 Beta AI   Мои примеры Photoshop 25.0 Beta AI   12. Adobe firefly >> PS 25.0 Beta AI генерирует быстро три варианта к запросу, которые можно дорабатывать, выделяя необходимые области, вводя новые запросы. Создаёт качественные результаты очень быстро по сравнению со Stable Diffusion, не требует дополнительных настроек, мощной видеокарты и сторонних платных серверов.
13. InvokeAI * >> >> Можно установить на компьютере и работать бесплатно, есть платные тарифы.
14. playgroundai.com Генерирует 512 изображения в течение 10 секунд, реалистично, можно сделать upscale 4x. Результаты не четкие.
15. starryai.com Показывает много результатов, подобных запросу уже сгенерированных изображений, но они неточные. Можно бесплатно сгенерировать 5 изображений, когда я тестировал изображения они были не фотореалистичные.
16. lexica.art Был краткий тестовый период, результаты неточны, затем платная подписка. lexica.art/aperture 768x1152, результаты точные, изображения профессиональные, но заблюренные в 3d игрушечном стиле, фэнтези стиле. Всего 20 тестов.
17. bing.com/create 100 бесплатных генераций из 4х изображений. Запросы точные, изображения в плохом освещении.
18. picfinder.ai генерирует простые запросы 512 достаточно качественно, качественные запросы не делает.
19. imagine.art >> >> Генерирует 512 за 30 сек., можно сделать upscale 1024, неточные результаты. 6 стилей. 10 изображений на 12 часов.
20. ideogram.ai ideogram.ai можно генерировать текст с графикой 1024, ища качественные промты в примерах.
21. freepik.com/pikaso/ai-image-generator Можно сгенерировать 20 бесплатных изображений в день.
  AI, замена лица        Обзор графических и видео нейронных сетей
Использую нейросети: clipdrop.co, letsenhance.io, upscale.media, aiseesoft.com, iloveimg.com, overscale.imagewith.ai, vectorizer.ai, vmake.ai, adobe.com (remove-background), myheritage.com, huggingface.co для реставрации лица >>, watermarkremover.io для удаления водяных знаков. ChatGPT, анализировал beta.dreamstudio.ai, instantart.io и другие.
image-to-video-ai.com FireFly *

Web-разработка пример: мой сайт без фреймворка

HTML5CSS3 >> Flexbox > > > > CSS Grid > > > > > SCSS > > > Tailwind CSS * > > > > > Bootstrap 5 * >
SVG > > > > Web-анимация Anime.js Мой баннер на anime.js Js Gsap > * > > Snap svg Node.js >> Gulp Xampp * Git > > > > >
JS (средний уровень) Изучал JavaScript онлайн-учебник learn.javascript.ru последовательно все темы, решал, разбирал задания.
Изучил первую и вторую часть, закончил на части 3 здесь, изучал также на этом сайте.
Мои результаты обучения: разбор, тестирование js примеров.
Смотрел другие курсы > > >
Про ООП (освоил материал, кроме dep injection) jQuery * > Zepto.js * > JSON > Основы PHP * > Twig Handlebarsjs * > Vue.js * Изучал основы: > > > > > React * Имею знания основ React.
Смотрел видео уроки
Изучил разделы: Установка и основные понятия
Введение и Быстрый старт
Руководство ReactJS props и state
Умею на реакте прикрутить верстку в приложение, разнести верстку на компоненты.
Изучал, тестировал курс React JS фундаментальный курс от А до Я
Visual Studio Code * > * Адаптивная верстка. Примеры:
Study online
products.fieldbee.com - лендинг, который я дизайнил и верстал на конструкторе Flexbe, а потом перевёрстывал на html, css, javasсript, bootstrap, php. Это делалось потому, что конструктор Flexbe на российской платформе и доступ к ней могли закрыть.
AldertonGlobal
Harley Hair Street Skin Clinic
Cellular Genetic Health Institut
SunTour
London Dealing House

CMS

Wordpress * С Joomla и Wordpress я знаком около 15 лет, умею полностью разработать сайт под эти cms. Создавал раньше сайты на WP. Смотрел курсы и создавал по ним сайты, чтобы зафиксировать что не знаю.
Создание wordpress темы (шаблона) с нуля.
Меню в WordPress
Пример сайта по уроку:   Лендинг-страница на WP, плагин Elementor
Курс по WordPress
Выполненный пример по курсу:   Сайт по курсу на WP
Как перенести WordPress сайт с localhost на хостинг?
Elementor Review 2023 - Is Elementor Still Best in 2023?
Joomla. * JoomShopping * Разрабатывал сайт на Joomla JoomShopping для одного небольшого интернет магазина, использовал разработанную тему, довёрстывал адаптивную версию, дорабатывал дизайн. Наполнял контент сайта и все страницы. Shopify * > У Shopify есть тестовый период на 3 дня, я тестировал Shopify на нескольких аккаунтах. В этом видео можно ознакомиться с работой в админ-панели сайта: Best Shopify Tutorial and Ultimate Step Step Step Guide для Начало в Set up Shopify store.< br> Shopify имеет разные темы, как бесплатные, так и платные. Можно использовать шаблон без редактирования кода только через панель администратора, но можно редактировать код в режиме разработчика и изменять шаблон.
Я изучал видео уроки, как создаются шаблоны для Shopify Liquid, это объемная работа. Шаблон Shopify Liquid состоит из большого количества файлов из специальным синтаксисом. Организация структуры файлов в шаблоне специфична, в папке sections есть файлы с расширением .liquid, в папке templates есть json файлы, пример Theme Development Tutorial, смотрел видео, анализировал, изучал разработку шаблона Shopify Liquid. В отдельной папке шаблона assets файлы CSS и JS. В файлах шаблона .liquid много кода с различными проверками liquid синтаксиса, css проверки стилей, json коды {% schema %}. Автор ролика синхронизировал работу файлов на локальном компьютере с файлами на гитхабе и подключил гитхаб на сайте. shopify. Процесс добавления синхронизации. При редактировании кода шаблона добавления контента shopify иногда долго реагирует, реакция может быть от 1 до 5 секунд или больше. Shopify Liquid имеет набор классов для css, которые можно использовать, например, для разметки сетки в коде. Для различных элементов можно найти определенные части кода, снипеть и использовать готовые решения.
Я имею знание html, css, javascript, могу создавать сайт на Shopify, знаю как пользоваться гитом.
Полезная информация: Shopify Обзор 2024 – плюсы, минусы и отзывы пользователей How to Edit HTML Code in Shopify - Shopify Tutorials Shopify. How to edit html/css files Does Shopify Have FTP? Полный Гайд по Shopify Liquid template language Liquid reference Несколько возможных альтернативных симуляторов в Shopify Theme Developmen Нельзя использовать Liquid to Create Custom Landing Page Templates Что такое Живость? Краткое изложение оснований Webflow * Webflow Conf 2023     Ценообразование Webflow (план и цены на 2024 г.)
Мне нравится Webflow, Это самый лучший конструктор сайтов (визуальный редактор), с которым я работал, но он платный.
Экспертный обзор Webflow (2024): достойный инструмент или очередной конструктор сайтов?
Смотрел видео Как быстро сверстать дизайн сайта на Webflow - Мир компьютерных инноваций Обзор конструктора. и по нему сделал   Мой пример страницы на Webflow.   Сделал бордеры у блоков, чтобы можно было видеть сетку верстки страниц.
Ранее тестировал из примеров Webflow такой небольшой сайт
Смотрел такой урок вёрстки одного сайту, тестировал по нему верстку страницы:   Моя работа на Webflow   Скрин в Webflow
Примеры анимаций в Webflow:   Анимация1   по уроку1   Аниация2   по уроку2
Просмотрел все трансляции на канале Kirill Zharkiy, который учит Webflow, я смотрел нюансы работы в Webflow. Он проводил обзоры разных других конструкторов и сравнивал их с Webflow. Примеры   CMS в Webflow        Анимации в Webflow   c Marketplace. По этому уроку Control a Cinema 4D animation with your mouse on a webpage — After Effects & Lottie in Webflow создал   Анимация 3d Galaxy в Webflow   (28 mb, задержка при загрузке). По этому уроку Animate a 3D render on scroll (same technique as Apple's AirPods Pro site) — Webflow + After Effects создал   Анимация вращения смартфона в Webflow
Изучал курс Figma to Webflow. Решил полностью выполнить его по видео, чтобы пройти весь процесс от 3d моделирования, визуализации, анимаций, разработки сайта в Webflow, публикации сайта на хостинге.   Мой результат по этому курсу
Сначала разработчики Webflow создавали проект в Figma в low fidelity и mid fidelity, затем для разработки high fidelity продолжают работу в Cinema 4D и Octane. У меня не было платной лицензии, обратился в Octane поддержку, они дали лицензию на 3 месяца изучения. Тестировал работу Octane рендер в Cinema 4D по уроку курса и другим видео. Выполнял сначала все за автором, создавал главную сцену, потом когда было много работы с другими сценами в моделировании, анимацией, смотрел их, анализировал. Поскольку уже были готовы изображения для Webflow, использовал их. Использовал After Effects для создания web-анимации из Сinema 4D в json и применения в Webflow. Создал лендинг в Webflow.
Изучил плагин Figma to Webflow plugin. Смотрел Webflow Labs introduces the Figma to Webflow plugin. Мой результат:   1. из Figma в Webflow   Другой курс: How to Use the Figma to Webflow Plugin | FREE COURSE. Мой результат:   2. из Figma в Webflow
Посмотрел этот курс Webflow 101. Лендинг, который разработчики создавали по этому курсу: getcalendarapp.com
Прошел тестирование после курса Webflow 101 Certification exam   Мой результат теста   Получил   Webflow certification
Другие видео и документация по Webflow: youtube.com/@Webflow university.webflow.com
Могу добавить формы в Webflow, як в уроке Безлимитные формы для Webflow Используем Xano, могу изучать Xano. Flexbe *

2d анимация: html5 баннера >> презентации с анимацией >>

Google Web Designer * > Adobe Animate | Flash * Имею опыт работы с Flash, создавал 2d анимации, рекламные баннера. Умею работать с костной анимацией, как в уроке. AS3/JS, основы CreateJS >
Lottie * Умею создавать анимацию Lottie и SVG в Figma, используя Plugin Animix Editor. На app.aninix.com можно создать бесплатно только два проекта. Есть экспорт в форматы Media: mp4, webm, gif (не більше 50 FPS); Lottie: json (normal), lottie(optimized), tgs(telegram); Другие: svg, png (sequence).
Анимацию Lottie могу создать также в After Effects и в SVGator. > > > * > * SVGator * Могу создавать анимацию в SVGator
Мой пример анимации Cat Walk скриншот в app.svgator.com, которую я создал по уроку How to Create an Animated Cat.
Смотрел все уроки по SVGator на канале: videos tutorials
SVGator позволяет экспортировать в бесплатном режиме только в формат SVG с анимациями, добавляя логотип, который можно удалить в коде. Доступны другие форматы для экспорта в платном режиме: Lottie JSON (.json/optimized.json), React Native (iOS/Android.dart), Video (.mp4/.avi/.mov/webm/mkv), Gif (.gif /.png/ .webp/ sequence). SVGator имеет более расширенный интерфейс создания анимации по сравнению с app.aninix.com, но он не интегрирован с Figma и с другими программами. В SVGator можно импортировать анимацию lottie в формате json, созданную в другом проекте, слои с анимированными кадрами работают правильно. При необходимости можно перенести проект, созданный в app.aninix.com в формате json у app.svgator.com и продолжить работу. Я раньше работал с Adobe Animate, создавал в нем анимированные Html5 баннера, презентации с анимациями и анимации для сайта. Adobe Animate позволяет экспортировать анимацию в Html5 Canvas, видео форматы, анимированный gif, PNG покадровую анимацию, а также VR и WebGl. Adobe Animate имеет большие возможности для выбора инструментов для работы с анимацией.
Но Adobe Animate не поддерживает экспорт в SVG, Lottie JSON форматы. Работа с SVGator схожа по созданию анимации в Adobe Animate и Adobe After Effects со своими ограничениями в выборе инструментов. > > > Основы костной анимации Spine * > * >> Dragon Bones * > > > > Изучал создание костной анимации в программах Spine и Dragon Bones. Пример ходьбы 2d персонажа

Онлайн реклама, аналитика

DoubleClick Studio * > Раньше я изучал DoubleClick Studio от Google - площадка для управления рекламными анимированными креативами под web. Проходил онлайн тестирования.
Я получил сертификации: HTML5 Studio, Dynamic Creatives, Google Web Designer, Custom Lightbox, Vpaid Badge, Youtube Badge, QA. > Google Analytics *

Дизайн и верстка печатных материалов >>

InDesign * QuarkXPress * Разработка презентаций в Figma * Power Point * Google Slides *

Моушн дизайн, видео монтаж

After Effects * Изучал и тестировал некоторые туториалы: After Effects tutorials

Изучал курс Михаила Бычкова Super After Effects 2022
Мои работы по курсу

Изучал курс Супер After Effects 2 (Видеокурс) + Бонусы 2017
Детальнее

Изучал курс по After Effects CC Супер Моушн 2015
Мои роботы по курсу

Мои роботи у After Effects > Premiere Pro * Изучал и тестировал туториалы: Premiere Pro tutorials Final Cut Pro * DaVinci Resolve * Изучал туториалы в разделе: DaVinci Resolve Edit
Примеры Pictory * Примеры

3ds Max * С 3ds Max я знаком достаточно давно, изучал с перерывами. Имею знания разработки интерьеров и экстерьеров, могу создавать низкополигональные модели по чертежам, uv текстуры. Некоторые примеры моих работ. Cinema 4D * Cinema 4D изучал Супер Cinema 4D, 2018
Мои работы по курсу Octane * Примеры Arnold * Примеры
Курс Arnold MographPlus Vray * Примеры Corona * Примеры
* * > >> Adobe Maximo * Unity * Изучал основы работы в Unity
Мои работы по урокам SketchUp * > > > Dimension * Изучал и тестировал все туториалы: Dimension Get Started
Adobe Dimension. 3D design made simple. Fusion * > (начальный)
Spline * Изучал Spline и делал все уроки по видео на YouTube каналах, мои результаты
Мой пример моделирования Polaroid Go в Spline

Операционные системы

Имею опыт работы и установки Windows Mac OS Ubuntu