Tworzenie prototypów witryn internetowych

Question

Chciałbym szybko prototypować nowe funkcje witryny. Szukam sposób:

• produkcji wokół istniejącego, złożonego stronie
• Zezwalaj na interaktywność
• Śmiesznie szybki i łatwy do wypróbowania nowych rzeczy

sobie wyobrazić coś, co pozwala mi powiedzieć "renderuj tę stronę, ale na stronach z takimi URL-ami, oznacz tą rzecz, którą teraz rysuję z postaciami z kija na stronę, a jeśli ktoś ją kliknie, przenieś tutaj".

Albo, być może, "tutaj jest zrzut ekranu strony internetowej. Jeśli ktoś kliknie to pole, pokaż im ten inny zrzut ekranu".

Co stosujesz do prototypowania funkcji interfejsu użytkownika?

Answer 1

Balsamiq Mockups. Więc. Freaking. Dobry.

EDIT: Więc tutaj jest wątek o więcej informacji na temat prototypów: https://stackoverflow.com/questions/720191/web-ui-prototyping-tools

Answer 2

Nie jestem fanem Balsamiq, ale wiele osób lubi to. Jeśli uruchomi się Napkee, wraz z Balsamiq będzie to, czego szukasz.

Alternatywą byłyby Fireworks - można go łatwo eksportować do HTML, ale krzywa uczenia się jest bardziej stroma niż Balsamiq.

Answer 3

Jeśli ma to być interractive i zbudowany na istniejącej stronie internetowej, można spróbować użyć Greasemonkey z Firefoksem: https://addons.mozilla.org/fr/firefox/addon/748

Nie jestem pewien, jak szybko można dokonać prototypy z tym, ale ty z pewnością mogą uczynić je interaktywnymi. Greasemonkey pozwala modyfikować dowolną stronę za pomocą javascript.

Answer 4

Możesz spróbować protoshare.

Wady: trochę powolne, wymaga danych karty kredytowej do bezpłatnego okresu próbnego. Wady: funkcje współpracy, tańsze od osi.

Answer 5

spróbuj clickframes - sposób na pisanie prototypów tekstowych w języku xml, które wyświetlają się na stronach internetowych, które można kliknąć.

zaskakująco skuteczna - na demie napisali specyfikację aplikacji (appspec), a następnie wygenerowali stronę opartą na szwie.

próbowali balsamiq i to nie działało dla nich.

z ich strony internetowej:

„Dla Projektantów

profesjonalistów User Experience używać Clickframes szybko Spec i prototyp interaktywność swoich projektów, a do przekazania projektu do współpracowników, jak i interesariuszy projektu Kiedy. projekt został udoskonalony, Clickframes ułatwia komunikację z programistami, którzy wdrożą aplikację."

Answer 6

Można spróbować ForeUI, tutaj jest tworzone sample prototype

Answer 7

Lubię http:. /www.iplotz.com - jest tam piękny UX i projektowanie http://www.justproto.com jest narzędziem również inetersting jej bardzo szybko, jego dostał czysty wygląd i jej bardzo łatwo stworzyć prototypy z nim

chceck się wireframes.linowski.ca to blog szumów na makiet

Answer 8

ołówek jest całkiem dobre i za darmo! można go pobrać jako samodzielna aplikacja lub jako firefox wtyczka:

http://www.evolus.vn/Pencil/

Answer 9

Za pomocą programu Mockuptiger można importować obrazy photoshop lub zrzuty ekranu witryny, a następnie łączyć je z klikalnymi linkami lub przyciskami.

MockupTiger to aplikacja internetowa, którą można hostować na własnym serwerze. Ma widgety do tworzenia aplikacji internetowych i pulpitu nawigacyjnego Wireframes.

UWAGA: działa tylko w najnowszych przeglądarkach. Możesz także pobrać i używać na swoim pulpicie.

PS: Jestem twórcą tego oprogramowania

Answer 10

Wyjazd ProtoShare ponownie: o wiele szybciej od około 2010, matryce i widżety biblioteki i znacznie bardziej elastyczna niż Balsamiq. Jeśli chcesz kontrolować wygląd swojego prototypu i chcesz mieć interaktywność oraz łatwą współpracę i przeglądanie, korzystaj z ProtoShare zamiast z Balsamiq.

Answer 11

Robię moje prototypy, jeśli chodzi o motywy/witryny WordPress z wtyczką od colorfully.me Jest to najszybszy sposób, aby zobaczyć, jak strona wyglądałaby w rzeczywistości, przetestować i poczuć, jak będzie wyglądać . Również kiedyś używam go do produkcji.

UI for prototype CSS