Jak wygenerować teksturę przypominającą resztki liści herbaty?

11

Pracujemy nad projektem na iPhone'a i Windows Phone 7, w którym chcielibyśmy być w stanie wygenerować liście herbaty na dnie filiżanki. Nie musi wyglądać fotorealistycznie, a tak naprawdę rysunek-y jest w porządku.

Jakie techniki powinniśmy badać, aby to osiągnąć? Czy są jakieś biblioteki (najlepiej w C, ale możemy tłumaczyć), które byłyby pomocne?

Oto kilka próbek pobranych z wyszukiwania grafiki Google

wprowadź opis zdjęcia tutaj wprowadź opis zdjęcia tutaj

Jedidja
źródło
Czy możesz bardziej szczegółowo określić swoje wymagania? Czy muszą się wirować, za każdym razem inne? Ponieważ jeśli nie ma żadnych wymagań dotyczących animacji lub wyjątkowości, nie rozumiem, dlaczego nie możesz po prostu użyć zdjęcia / rysunku jako tekstury.
phillipwei,
@phillipwei Tak, za każdym razem musiałyby być inne, a przynajmniej na tyle rozsądne, aby nie przypominały zdjęć stockowych czy cokolwiek innego.
Jedidja,

Odpowiedzi:

15

Jak zapewne bym to zrobił, abym mógł zachować kontrolę nad sztuką i nie spędzać dużo czasu próbując ulepszyć metodę proceduralną, aby uzyskać właściwy efekt ...

Po pierwsze, ręcznie utwórz kilka sprajtów kępek liści herbaty jako „pulę” sztuki - nie każda jako wartość liści herbaty, ale bardziej jako mniejsza grupa. Powiedz, około 20 z nich?

Następnie umieść ich losową liczbę na losowych współrzędnych na podstawie „kubka”. Daj każdemu losowy obrót i skalę oraz losowe odbicie lustrzane w poziomie i / lub w pionie. To powinno stworzyć dobry wynik.

Takie podejście zapewni artystyczną swobodę w tworzeniu pojedynczych grup, aby wyglądały tak, jak chcesz, jednocześnie pozwalając na ogromną różnorodność wyników (przy założeniu wystarczającej liczby duszków do wyboru).

Dodatkowo, dzięki tej (i dowolnej losowej metodzie, w tym opartej na szumie Perlina), można faktycznie zaszczepić generator liczb losowych na początku procesu znanym ziarnem, aby uzyskać powtarzalne wyniki. Jeśli zapiszesz ziarno, będziesz w stanie dokładnie odtworzyć ten sam wzór, ponownie sadząc tuż przed rozpoczęciem sekwencji. Możesz nawet robić fajne rzeczy, np. Wpisać imię i nazwisko, zamienić litery na cyfry (suma ASCII itp.), A następnie użyć tego jako ziarna jako pewnego rodzaju „tego wzoru liści herbaty dostosowanego do CIEBIE!” rzecz.

Oto pseudokod tego, co mam na myśli, jeśli to pomaga ...

var sprites = [...]; // Array of tea leaf sprites

var n_leaves = rand(5)+5; // Random number of leaves from 5-9
for (i=0; i<n_leaves; i++) {
    var sprite_index = rand(sprites.length);  // Random sprite index
    var r = rand(CUP_DIAMETER);          // Random radius for point on disk calc
    var theta = rand(2*PI);              // Random theta (rotation) for point on disk
    var sprite_x = sqrt(r) * cos(theta); // Sprite X
    var sprite_y = sqrt(r) * sin(theta); // Sprite Y
    var sprite_rotation = rand(2*PI);    // Sprite rotation
    var sprite_scale = rand(1) + 0.5;    // Sprite scale from 0.5 to 1.5
    var sprite_h_mirror = (rand(1) < 0.5 ? true : false); // If true, mirror horizontally
    var sprite_v_mirror = (rand(1) < 0.5 ? true : false);   // If true, mirror vertically
    draw_sprite(sprite_index, sprite_x, sprite_y, sprite_rotation, sprite_h_mirror, sprite_v_mirror);
}

Sprawdź http://mathworld.wolfram.com/DiskPointPicking.html, aby uzyskać świetną dyskusję o tym, jak wybrać losowy punkt na dysku i dlaczego używam tego całego sqrt / sin / cos.

Tim Holt
źródło
7

Spróbuj szum perlin z dwójkową wartością odcięcia około 0,8?

Przesłano przykładowy obraz na http://imgur.com/a/Ydc4y . Pierwszy to drugi obraz z zastosowanym progiem. Drugi to podstawowy hałas perlina, dla którego można znaleźć wiele dobrych referencji, takich jak http://en.wikipedia.org/wiki/Perlin_noise i http://http.developer.nvidia.com/GPUGems2/gpugems2_chapter26.html .

Możesz grać trochę z liczbą i skalą oktaw w szumie perlin, aby różnicować, jak gładko będzie wyglądać moc wyjściowa, a także z progiem określającym, ile (średnio - jak to hałas) liści herbaty będzie.

dascandy
źródło
3
To może być lepsza odpowiedź z niektórymi linkami i przykładami tego, co można stworzyć.
MichaelHouse
dobry pomysł, chociaż można zastosować obrazy statyczne, a obszar kołowy można zacisnąć w module cieniującym piksele, a krawędzie tego koła wygładzić bez konieczności tworzenia wartości szumu Perlina na piksel (z mojego doświadczenia wynika, że ​​ta metoda jest nieco powolna ).
teodron
Generowanie samego szumu perlinowego jest nieco ciężkie; Możesz jednak użyć wstępnie obliczonej tekstury szumu dla tego (i wielu innych) efektów. Możesz także użyć tej metody, aby wstępnie obliczyć kilka.
dascandy
4
-1. Po obejrzeniu wielu liści herbaty i dużej sumy (1 / f) hałasu Perlina nie mogę powiedzieć, że wyglądają podobnie. Hałas Perlina może być właściwym punktem wyjścia, ale cel nie jest odpowiedni dla zwykłego wariantu sumy (1 / f).
1
Zgadzam się, że podejście z hałasem perlin jest niepraktyczne. Aby to zweryfikować, próbowałem odtworzyć efekt w Photoshopie, zaczynając od szumu Perlina. Oto wynik . Chociaż myślę, że wygląda w porządku, problem leży w ilości od szczypanie musiałem zrobić. Naprawdę nie mogę wymyślić sposobu na odtworzenie całego tego ulepszenia proceduralnego, dlatego głosuję na podejście oparte na ikonkach sugerowane przez Tima Holta.
David Gouveia,