Russian Qt Forum

Qt => Пользовательский интерфейс (GUI) => Тема начата: Bepec от Сентябрь 07, 2014, 12:48



Название: Иконки, картинки и прочее
Отправлено: Bepec от Сентябрь 07, 2014, 12:48
Собственно хотелось бы спросить - не знает ли кто ресурсов, на которых можно взять под Free лицензию иконки, картинки и прочую визуальную красоту для элементов интерфейса.

Пример: iconfinder.com

Так же интересуют сайты, где можно скачать подборки иконок/картинок.
IconFinder даёт иконки на кнопки.
А хочется чтобы имелась база картинок состояния элемента.

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

Ищу давно, но централизованного не нахожу.

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


Название: Re: Иконки, картинки и прочее
Отправлено: Igors от Сентябрь 07, 2014, 13:02
Ну например кнопка : картинки нажата, отжата, наведение мыши. И всё это в одной подборке и можно сразу натягивать.

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


Название: Re: Иконки, картинки и прочее
Отправлено: Bepec от Сентябрь 07, 2014, 13:21
Не спорю, если заморочиться то нужен дизайнер.
Картинка на кнопка  100 на 100  подойдёт и для всех меньших размеров. И так далее.

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

PS давным давно я находил сайт одного энтузиаста, он просто учился рисовать - и вот у него было штук 30 разных кнопочулек с состояними.


Название: Re: Иконки, картинки и прочее
Отправлено: Nidxogg от Сентябрь 07, 2014, 14:54
Посмотри на ui-cloud.com  (http://ui-cloud.com)и подобных ему
Какая лицензия обычно указывается


Название: Re: Иконки, картинки и прочее
Отправлено: vregess от Сентябрь 07, 2014, 14:58
Можешь глянуть http://p.yusukekamiyamane.com/ (http://p.yusukekamiyamane.com/). Там 2 версии. Для бесплатной версии надо указать авторство где-нибудь (http://p.yusukekamiyamane.com/icons/attribution/ (http://p.yusukekamiyamane.com/icons/attribution/))

Ну а так ищи что-то типа free UI kits и отсеивай.

желание "сделать красиво" периодически вспыхивает у любого - но столь же быстро затухает
Знакомо) Останавливает в основном незнание базовой теории типа теней/градиентов.


Название: Re: Иконки, картинки и прочее
Отправлено: Bepec от Сентябрь 07, 2014, 21:24
У меня печальная ситуация - я знаю про градиенты/тени/блики/пропорции, но вот рисую с завидной медлительностью :D


Название: Re: Иконки, картинки и прочее
Отправлено: navrocky от Сентябрь 07, 2014, 22:15
Блымающие кнопочки умерли в 90х, сейчас лучше или нормальный дизайн сделать всего приложения, или лучше не трогать дефолтную системную тему.


Название: Re: Иконки, картинки и прочее
Отправлено: Fregloin от Сентябрь 08, 2014, 11:43
iconsearch.ru


Название: Re: Иконки, картинки и прочее
Отправлено: Bepec от Сентябрь 08, 2014, 14:49
navrocky покажите мне пожалуйста дефолтный системный индикатор активности с четыремя состояниями выкл/вкл/занят/ошибка.

Чесслово, буду рад :D


Название: Re: Иконки, картинки и прочее
Отправлено: OKTA от Сентябрь 08, 2014, 15:01
 ;D вот он индикатор  ;D


Название: Re: Иконки, картинки и прочее
Отправлено: Igors от Сентябрь 08, 2014, 15:29
navrocky покажите мне пожалуйста дефолтный системный индикатор активности с четыремя состояниями выкл/вкл/занят/ошибка.

Чесслово, буду рад :D
Да хотя бы текст (on/off/busy/error) + кнопка (stop/go/-/reset). Это не вопрос дызайна


Название: Re: Иконки, картинки и прочее
Отправлено: Bepec от Сентябрь 08, 2014, 15:50
Igors - не в тему.
Напомню тема -  "Иконки, картинки и прочее".

Это вопрос дизайна. Индикатор позволяет человеку СРАЗУ понять положение дел, без осознания и прочтения. Я  думаю вы об этом осведомлены и можете даже прочитать лекцию.

Так вопрос - индикатор. дефолтный. которого тупо нет. Есть кучи иконок с различными состояними, но они специализированы. Тот же брандмауэр - у него это щит разных цветов. Центр оповещения - флажок с индикатором снизу. Общего стиля нет.

to OKTA - это гениальный и бессмысленный индикатор с одним состоянием всё плохо :D


Название: Re: Иконки, картинки и прочее
Отправлено: OS2 от Сентябрь 08, 2014, 18:37
https://www.iconfinder.com/
http://findicons.com/
http://www.iconsearch.ru/
http://icons8.com/
http://www.flaticon.com/
http://www.iconarchive.com/
https://octicons.github.com/
http://pixelbuddha.net/
http://www.artgide.com/


Название: Re: Иконки, картинки и прочее
Отправлено: navrocky от Сентябрь 08, 2014, 19:09
navrocky покажите мне пожалуйста дефолтный системный индикатор активности с четыремя состояниями выкл/вкл/занят/ошибка.

Чесслово, буду рад :D

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

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


Название: Re: Иконки, картинки и прочее
Отправлено: Bepec от Сентябрь 08, 2014, 20:26
ну возьмём простейший круглый светодиод. Ради красивости у него, исходного, имеется рамка с градиентом аля тень + на неё падает отсвет. Внутри рамки градиент аля "текущий цвет", сверху пририсованы блики и всё пространство вокруг него немного блюрится текущим цветом аля отсвет. Чтобы поменять цвет, надо произвести реверс инжиринг млеа картинки :D Т.е. разложить по слоям цвет/блики/рамка/отсвет/тень. И при изменении цвета так же менять цвет/блики/отсвет. И это легко когда картинка 1024x768 и очень непросто при 256x256. Неправильного оттенка пиксель тут же портит картину.


Название: Re: Иконки, картинки и прочее
Отправлено: Igors от Сентябрь 09, 2014, 06:54
ну возьмём простейший круглый светодиод. Ради красивости у него, исходного, имеется рамка с градиентом аля тень + на неё падает отсвет. Внутри рамки градиент аля "текущий цвет", сверху пририсованы блики и всё пространство вокруг него немного блюрится текущим цветом аля отсвет. Чтобы поменять цвет, надо произвести реверс инжиринг млеа картинки :D Т.е. разложить по слоям цвет/блики/рамка/отсвет/тень. И при изменении цвета так же менять цвет/блики/отсвет. И это легко когда картинка 1024x768 и очень непросто при 256x256. Неправильного оттенка пиксель тут же портит картину.
Похоже на примитивный шейдинг. Грубо говоря, не рисуется по пикселям, а рендерится как 3D модель (обычно очень упрощенно).  Но конечно судить на основании "пересказа картинки" бесполезенo. Предъявляйте ее - или не упоминайте вообще.


Название: Re: Иконки, картинки и прочее
Отправлено: Bepec от Сентябрь 09, 2014, 12:15
Вот например. Хочется из неё получить подборку черная/красная/зелёная, только с бОльшим количеством цвета в центре. Сколько это времени займёт?


Название: Re: Иконки, картинки и прочее
Отправлено: navrocky от Сентябрь 09, 2014, 12:29
Вот например. Хочется из неё получить подборку черная/красная/зелёная, только с бОльшим количеством цвета в центре. Сколько это времени займёт?

В гимпе есть замена цвета. А лучше найти его в SVG, тогда цвет поменять - пустяк.


Название: Re: Иконки, картинки и прочее
Отправлено: Igors от Сентябрь 09, 2014, 12:43
Первый путь - мазюкать. Здесь это несложно. Замещаете красный цвет на черный (хоть в фотошопе). Остаются только блики, сохраняете их. Рисуете круг с внутренними/внешними цветами какими хотите и сверху добавляете сохраненные блики. Тут правда одна заковыка - с др цветом (вместо черного) она будет смотреться хуже.

Второй: необязательно, но вероятно блики не рисовались руками а рендерились. Берется модель кнопки (спокойно, это 10 минут, если надо я дам) и на нее бросается сферическая карта отражения (хотя бы неск белых пятен). Можно в OpenGL, можно в любом доступном 3D пакете.


Название: Re: Иконки, картинки и прочее
Отправлено: Bepec от Сентябрь 09, 2014, 13:09
Эммм... Я в 3d как конь в крапиве разбираюсь :D
А так, давайте конечно и посоветуйте как сделать :)


Название: Re: Иконки, картинки и прочее
Отправлено: kandrey от Сентябрь 09, 2014, 13:18
http://ru.vectorboom.com/load/web_dizajn/userinterfaces/7-1-0-62


Название: Re: Иконки, картинки и прочее
Отправлено: Igors от Сентябрь 09, 2014, 15:07
Ну вот карта отражения и результат. В zip то же + obj модель


Название: Re: Иконки, картинки и прочее
Отправлено: Bepec от Сентябрь 09, 2014, 18:53
to kandrey - прекрасный урок по кнопкам, но ничего нужного мне :)

to Igors: что с ними делать? Я вижу картинки, а как получить кнопку? Точнее с помощью чего.

PS и уже набившее вам оскомину - я в графике слаб :D


Название: Re: Иконки, картинки и прочее
Отправлено: Igors от Сентябрь 10, 2014, 09:00
что с ними делать? Я вижу картинки, а как получить кнопку? Точнее с помощью чего.
Рисуете красный (или какой надо) круг и к нему добавляете картинку бликов (точнее отражений). Как изготовить др отражения - см выше


Название: Re: Иконки, картинки и прочее
Отправлено: Bepec от Сентябрь 10, 2014, 11:05
Извиняюсь конечно, но у меня тут закавыка - у меня имеется 2 картинки и obj файл. Что с этим хозяйством делать - хз. Т.к. я даже не в курсе как эту карту отражений преобразовать в картинку. С помощью чего?

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


Название: Re: Иконки, картинки и прочее
Отправлено: Igors от Сентябрь 10, 2014, 11:11
Извиняюсь конечно, но у меня тут закавыка - у меня имеется 2 картинки и obj файл. Что с этим хозяйством делать - хз. Т.к. я даже не в курсе как эту карту отражений преобразовать в картинку. С помощью чего?
Любой 3D пакет (не мне Вас учить где брать ломаный софт, а есть и бесплатные, напр Blender), Можно и самому на OpenGL/Qt. Грузите туда модель, назначаете reflection map.  Рендерите - готово


Название: Re: Иконки, картинки и прочее
Отправлено: Bepec от Сентябрь 10, 2014, 11:17
Ну хоть что то :) Попробую.


Название: Re: Иконки, картинки и прочее
Отправлено: navrocky от Сентябрь 10, 2014, 12:03
ИМХО гораздо проще рисовать такие кнопки в SVG в Inkscape, чем рендерить в Blender. Туториалов для дизайнеров масса как и из каких примитивов составлять все эти леденцовые шарики, там буквально 3-4 эллипса с градиентами. Можно взять любую SVG иконку и разобраться из чего она состоит, а если найдется похожая на необходимую, то путем нехитрого редактирования можно получить то что надо.

За основу можно брать Oxygen http://kde-look.org/content/show.php/Oxygen+Icons?content=74184, или Tango http://tango.freedesktop.org/Tango_Icon_Library


Название: Re: Иконки, картинки и прочее
Отправлено: Bepec от Сентябрь 10, 2014, 12:09
Ещё круче :) Теперь и SVG осваивать :D Я ещё с блендером нихрена не разберусь :D


Название: Re: Иконки, картинки и прочее
Отправлено: kandrey от Сентябрь 10, 2014, 14:25
Зря вы так - 3D, реверсинжиниринг...  Не пожалейте неделю времени на adobe illustrator, вы удивитесь как просто нарисовать эти светодиоды с бликами,..5 мин


Название: Re: Иконки, картинки и прочее
Отправлено: OKTA от Сентябрь 10, 2014, 14:28
Эх, рисовать - это дело дизайнера.


Название: Re: Иконки, картинки и прочее
Отправлено: kandrey от Сентябрь 10, 2014, 14:55
Согласен. Но если все таки приходится рисовать самому, то лучше делать это правильными инструментами - много времени можно сэкономить.