GoldenLine
Zaloguj się

konto usunięte

Temat: Jak stworzyć interaktywny program (czysty...

Technologie:

Strona html+css+java script jako "Silnik".

"Samo 3D" za pomocą blender-a i 3dnp (3D no plugin) czyli model 3d z blender-a wprost na stronę www. To jako Baza.
http://www.thoro.de/page/3dnp-introduction-en

Jak można zauważyć, w przykładzie po kliknięciu i przytrzymaniu pendriva można go obracać.

Czy da się zrobić grę/interaktywna animacje np: Wizualizacja przyszło budowanego domu, z możliwością przemieszczania się w 3D.

http://www.thoro.de/files/3DNP/FRITZWLAN/3DNP.htmlAdam Ł. edytował(a) ten post dnia 29.01.11 o godzinie 14:18
Link do wypowiedziLink

konto usunięte

Temat: Jak stworzyć interaktywny program (czysty...

W przykładzie obracający się pendrive to po prostu seria obrazków wygenerowana w blenderze, to nie jest "prawdziwe" 3D.

Takie "prawdziwe" 3D z dowolnym ruchem kamery itp. można osiągnąć w js+html za pomocą elementu <canvas>. Powstało już kilka bibliotek ułatwiających to zadanie, np. http://www.c3dl.org/
Małym minusem może być, że js może czytać tylko tekst i obrazki, więc modele mogą być dość duże (np. collada czy .obj), ale wszystko jest do zrobienia.
Link do wypowiedziLink

konto usunięte

Temat: Jak stworzyć interaktywny program (czysty...

To jest bezpośredni model 3D z Blendera na stronę www+js.
To nie jest seria zdjęć, choć pewnie serje jakis ramek zawiera, jak każda animacj czy film.
Zauważ, że istnieje interakcja po przytrzymaniu LPM i obracaniu tym pendrivem.



3DNP comes with a Python script for Blender

that produces a camera 	path to render images

fitting into 3DNP.


Ale najbardziej mnie ciekawi, czy dało by się zamienić tą sekwencje na jedne plik lub kilka (do 10 ) plików *avi. i w zależności od ruchów myszką czy przyciśniętych klawiszy, sterować akcją?
Dzięki temu, przeglądarka nie musiałby wspierać webgl.
inna sprawa wydajność tego.Adam Ł. edytował(a) ten post dnia 29.01.11 o godzinie 15:38
Link do wypowiedziLink

konto usunięte

Temat: Jak stworzyć interaktywny program (czysty...

Tak, jak Krzysztof napisał, jest to seria zdjęć, inaczej mówiąc animacja składająca się z 36 klatek:
Klatka 1:

Obrazek

Klatka 2:

Obrazek


...

Klatka 36

Obrazek


A jedyny "bajer" polega na tym, że możesz tą animacją sterować myszą.
Link do wypowiedziLink

konto usunięte

Temat: Jak stworzyć interaktywny program (czysty...

Adam Ł.:
To jest bezpośredni model 3D z Blendera na stronę www+js.
Równie dobrze może być z MS Painta czy Movie Makera, to tylko obrazki.
Adam Ł.:
To nie jest seria zdjęć, choć pewnie serje jakis ramek zawiera, jak każda animacj czy film.
To JEST seria zdjęć.
Adam Ł.:
Zauważ, że istnieje interakcja po przytrzymaniu LPM i obracaniu tym pendrivem.
Interakcja myszką po prostu podmienia zdjęcie na kolejne/poprzednie.
Adam Ł.:
3DNP comes with a Python script for Blender
that produces a camera path to render images
fitting into 3DNP.
Podkreśliłem Ci istotny fragment. 3DNP po prostu robi "zrzut" animacji do serii obrazków z jakimś skryptem js który pozwala zmieniać je poruszając myszką.
Adam Ł.:
Ale najbardziej mnie ciekawi, czy dało by się zamienić tą sekwencje na jeden plik lub kilka (do 10 ) plików *avi.
.avi to bardzo kiepski format jeśli chodzi o strony www i nie sądzę aby istniała biblioteka js(mogę się mylić) umożliwiająca nawigowanie po pojedynczych klatkach. Wydajność tego byłaby tragiczna. Alternatywą mógłby tu być .gif (użyty zdaje się przez 3DNP) trzymający tą serię klatek.
Oczywiście możesz sobie zrobić np. milion takich obrazków poukładanych w różne "ścieżki", np. żeby poruszać się po korytarzach, wybierając odpowiednią serię obrazków na rozdrożach w zależności od ruchu myszki np., ale nadal ma to niewiele wspólnego z 3D.Krzysztof Kawa edytował(a) ten post dnia 29.01.11 o godzinie 16:58
Link do wypowiedziLink

konto usunięte

Temat: Jak stworzyć interaktywny program (czysty...

Jednak, jak się okazuje, zestawienie serii, "ścieżek"
to dobry pomysł na w miarę łatwą animacje przemieszczania się.

Niestety nie, nie równie dobrze paint czy Movie Maker ( w ten czas tylko 2D, do dyspozycji, w miarę rozsądnym czasie ) ;->

Różnica taka Że za pomocą, Blender 3D, tworze pełny 3 wymiarowy model,
z dokładnie taką serią zdjęć jaką chce autor :-), generowaną z automatu.
czyli zdjęcia - imitują 3D.
Niedługo zamieszczę docelowy efekt ;-)
Link do wypowiedziLink
Michał Kubiak

Michał Kubiak Programista

Temat: Jak stworzyć interaktywny program (czysty...

HTML5 + Canvas ? http://www.apple.com/html5/showcase/threesixty/Michał Kubiak edytował(a) ten post dnia 07.02.11 o godzinie 21:04
Link do wypowiedziLink

konto usunięte

Temat: Jak stworzyć interaktywny program (czysty...

Michał Kubiak:
HTML5 + Canvas ? http://www.apple.com/html5/showcase/threesixty/

Znaczy takie wykorzystanie Canvas jak poniżej?


Obrazek


Obrazek


Obrazek


Numeracja idzie dalej - toż to taki sam przykład jak powyżej ;)Waldek Mazurek edytował(a) ten post dnia 07.02.11 o godzinie 21:23
Link do wypowiedziLink
Michał Jastrzębski

Michał Jastrzębski Django-fu, phpjutsu,
sql-do

Temat: Jak stworzyć interaktywny program (czysty...

Flash, air, silverlight? Nie ruszałbym 3d bez czegoś, co służy do 3d. Inaczej to w taki czy inny sposób będzie złe.
Link do wypowiedziLink
Jakub L.

Jakub L. Programista

Temat: Jak stworzyć interaktywny program (czysty...

Powiadasz?
http://www.romancortes.com/blog/how-i-did-the-1kb-chri...
(pod FF widać że to trochę słaby pomysł, albo że FF ma sporo do nadrobienia).
Link do wypowiedziLink
Michał Jastrzębski

Michał Jastrzębski Django-fu, phpjutsu,
sql-do

Temat: Jak stworzyć interaktywny program (czysty...

Właśnie o tym mówię. Nie twierdzę, że się nie da, bo da się, chociażby tym slideshowem nieszczęsnym. Jednak nie jest to rozwiązanie, które osobiście wykorzystałbym w czymkolwiek, co chcę pokazać klientom...ie w ogóle nie wspiera html5 i css3 (w praktyce) itp itd. Jakbym miał robić coś w 3d to bym wykorzystał coś ze wsparciem 3d...po prostu wtedy jest pewność że to zadziała na znakomitej większości komputerów.
Link do wypowiedziLink
Michał Kubiak

Michał Kubiak Programista

Temat: Jak stworzyć interaktywny program (czysty...

Waldek Mazurek:
Michał Kubiak:
HTML5 + Canvas ? http://www.apple.com/html5/showcase/threesixty/

Znaczy takie wykorzystanie Canvas jak poniżej?


Obrazek


Obrazek


Obrazek


Numeracja idzie dalej - toż to taki sam przykład jak powyżej ;)Waldek Mazurek edytował(a) ten post dnia 07.02.11 o godzinie 21:23
No dobrze dałem się nabrać. Pisałem na szybko :)
Link do wypowiedziLink

konto usunięte

Temat: Jak stworzyć interaktywny program (czysty...

Michał Jastrzębski:
Właśnie o tym mówię. Nie twierdzę, że się nie da, bo da się, chociażby tym slideshowem nieszczęsnym. Jednak nie jest to rozwiązanie, które osobiście wykorzystałbym w czymkolwiek, co chcę pokazać klientom...ie w ogóle nie wspiera html5 i css3 (w praktyce) itp itd. Jakbym miał robić coś w 3d to bym wykorzystał coś ze wsparciem 3d...po prostu wtedy jest pewność że to zadziała na znakomitej większości komputerów.

Po za telefonami komorkowymi, ktore nie obsluguja np. flasha (albo robia to bardzo kiepsko). Rozwiazanie na JS i klatkach sprawdzi sie o niebo lepiej :)
Link do wypowiedziLink

konto usunięte

Temat: Jak stworzyć interaktywny program (czysty...

Stworzyc takie cos jest "stosunkowo" prosto korzystajac z http://scenejs.org/ czy http://www.cubicvr.org/index.php?option=com_content&vi... czy tez http://www.ambiera.com/copperlicht/index.html - te temat bedzie wielki soon. Jedyny problem to IE - i przez narazie to wszystko mozna wrzucic do zamrazarki gdy obecnie nie ma planow dotyczacych wsparcia do WebGL w IE ...

Dodam jeszcze to http://code.google.com/p/blender-webgl-exporter/ czy to https://github.com/dfletcher/yawgle gdyz temat jest mi dosc bliski. WebGL to technologia mloda ktora nie zostala jeszcze ustanddaryzowana wiec trzeba z tym poczekac. iPhone nie obsluguje jeszcze tego, IE jak wspomnialem - wiec narazie jest to piesn przyszlosci.Paweł Krefta edytował(a) ten post dnia 07.03.11 o godzinie 00:24
Link do wypowiedziLink
« Wróć do tematów
Odpowiedz

Podobne tematy


Następna dyskusja:

jak zapobiec przeskakiwaniu...




Wyślij zaproszenie do
Anuluj