Как перенести дизайн из программы в веб и сохранить все элементы на своих местах?

Question

[Chvalov]

Допустим есть вот такая программа для компьютера:

Как мне весь ее дизайн перенести в веб, для дальнейшей работы ?
Желательно с помощью какой-то программы, или же может есть какой-то плагин для Adobe Photoshop чтобы все это из psd собрать в html.

Или же какой-то редактор в котором все это можно разложить на форме и сохранить в html.

Заранее благодарен

Comments

[Chvalov]

Ну и вот еще картинка для примера

Answer 1

[Денис Инешин]

Это делает HTML-верстальщик, наймите.

Comments

[Chvalov]

Мне самому интересно как это делать, так сказать для само развития )

[Денис Инешин]

Chvalov: Ну, научитесь Html верстке) тут полно вопросов на эту тему.

[PO6OT]

Денис Инешин: вы совершенно не правы. в вопросе сказано с помощью программы и точь в точь КА есть

[PO6OT]

Денис Инешин: как*

[PO6OT]

Денис Инешин: у него уже есть наверстанная страница в формате psd, а теперь нужен всего-лишь переводчик с psd в html. что непонятного?

[Денис Инешин]

Вадим Егоров: PSD -> HTML - это и есть вёрстка.

Answer 2

[Александр Таратин]

habrahabr.ru/post/137336

Comments

[Chvalov]

Интересно, нужно будет по пробовать

[PO6OT]

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

Answer 3

[Сергей]

Перенести все автоматически в html не получится, а если и получится как то внести скриншот в photoshop и разложить его на слои, а потом создать верстку, то все равно придется вносить много правок.
Намного проще сделать с нуля

Comments

[Chvalov]

У меня есть все элементы в png которые на форме и есть скриншот
Я уже думал все красиво разместить на своих местах, но вот как это потом сохранить в html ?

[evnuh]

Chvalov: это называется вёрстка, вам уже ответили, это целая профессия. Вы спрашиваете "как сделать из картинки html?" это равносильно "как сделать из деревьев баню?"

[Chvalov]

evnuh: Я не сказал что из картинки !
У меня есть psd где все разбито то слоям и группам

Answer 4

[Максим Е]

Подобные простые макеты лучше всего верстать с нуля.
Занимаются этим верстальщики HTML.

Comments

[Chvalov]

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

[Максим Е]

Я верстаю все с нуля в блокноте для программистов :)

[Сергей]

текстовый редактор с подсветкой синтаксиса (notepad++ например) или IDE + браузер + инструменты разработчика в браузере.

[Chvalov]

Сергей: Ясно, но я больше привык к продуктам от JetBrains и к Sublime Text )

[PO6OT]

Максим Креативный: у него уже есть наверстанная страница в формате psd, а теперь нужен всего-лишь переводчик с psd в html. что непонятного?

[Максим Е]

Вадим Егоров: нет таких нормальных переводчиков

[PO6OT]

Максим Креативный: ну а ненормальные есть?

Answer 5

[Мари Арти]

верстка производится методом набора кода руками ) если бы был полноценный инструмент, не было бы профессии верстальщик, и дизайнеры бы сами отправляли все "в веб".

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

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

Comments

[Chvalov]

Программа работает и все заносит в БД, мне собственно нужно будет просто брать данные и отображать )

[PO6OT]

у него уже есть наверстанная страница в формате psd, а теперь нужен всего-лишь переводчик с psd в html. что непонятного?

[Мари Арти]

Chvalov: отображать можно, раз сделав страницу и подписав цифры. а как часто нужно менять эти цифры? кто и как их будет менять? руками копируя данные из базы? будет ли меняться содержимое (блоки, картинки)? смысла переносить программу на html нет - html это статика. написали страницу, но в ней ничего не будет меняться. функционал самой программы (настройки и тд) не будет работать. на html это будет, грубо говоря, вордовский документ - куча картинок и текст.
все вышесказанное верстальщика не отменяет.

Вадим Егоров: пришел и решил все проблемы своим комментарием. такой переводчик - верстальщик, что непонятного?

[PO6OT]

miminari13: я написал объяснение того, что просит создатель вопроса, а то что данные будут статичны и что это нужно исправлять - это уже оффтоп, так что не надо тут ляля и отвечайте конкретно на вопрос: есть ли переводчик psd в html

[Мари Арти]

Вадим Егоров: вы сами создатель вопроса, что можете за него ответить, что он хочет?
и про статику и тд это не оффтоп. всегда и во всем нужна четкая постановка задачи. если ее трудно сформулировать, нужно отвечать на вопросы. тут не пойми, то ли картинку поставить на фон, то ли полноценный функционал программы с получением и выводом данных.
потом обращаются люди, сами не понимают, что хотят. и оказывается нужно аналог фотошопа последней версии сделать на сайте за 500 рублей: "это же так легко, давно все adobe сделали, вам только перенести".
в ваших комментариях пользы вообще никакой. абсолютно.