ThemeForest: Vártuk a medvét, de nem jött elő!
A történet 4 hónappal ezelőttre nyúlik vissza. Ekkor fogalmazódott meg bennem, hogy itt az ideje meghódítani a ThemeForestet. Kezdésnek körülnéztem, hogy milyen témában lenne érdemes alkotnom, mik azok a trendibb sablonok, amiket vesznek, visznek.
Mivel ez az első sablonom és nem tudom mire számítsak elsőre egy egyszerűbbnek tűnő témát választottam, egy egyoldalas landing oldalt. Egészen pontosan egy eseményt meghirdető landinget.
Ezt követően körülkérdeztem a piactér fórumán, hogy kinek milyen tapasztalata van az elbírálásokkal kapcsolatban. A válaszok egyöntetűek voltak: Szigorúak, pláne a kezdőkkel szemben. Semmi baj, szeretem a kihívásokat, így elkezdtem kidolgozni először csak papíron a vázlatomat.
A vázlatot átadtam egy grafikus ismerősömnek, aki ez alapján elkészítette a PSD-t belőle. Ez alapján pedig jöhetett a kódolás. Itt szemügyre vettem az Envato iránymutatásait, illetve vettem néhány sablont, hogy megnézzem, hogy is csinálják ezt a profik.
Amire fontos odafigyelni, hogy minden alkotóelemet jól szeparáljunk el. Tehát ne legyenek ömlesztve a css, javascript, html fájlok. Mindent rendezzünk mappába. Az előre megírt pluginokat, amiket beépítünk, belepiszkálás nélkül az eredeti nevével használjuk fel, szintén jól elszeparálva, hogy látható legyen, hogy azt külső forrásként használtuk fel. Én erre egy vendor nevű mappát hoztam létre.
No igen, erre inkább most figyelj!
A saját css-hez kell írni egy úgynevezett tartalomjegyzéket. Ebben szerepelnie kell az szerző adatainak és hogy mit tartalmaz az adott fájl.
Segítség képpen ezt a linket osztotta meg velem a ThemeForest egyik adminisztrátora: segédlet.
Szintén saját javascript fájlunknál végezzük el ezeket a lépéseket. Legyünk körültekintőek, hiszen az adminok csak a saját általunk írt css és javascript állományainkat bírálják. Éppen ezért, amikor már azt hinnénk, hogy kész, rájössz, hogy még se.
Legnépszerűbb hibák, amibe én is belefutottam és a fórum is hemzseg az ilyesfajta kérdésektől: Régebbi IE (9-ig) és Safari böngészők alatt valami nem jól jelenik meg, vagy egyáltalán nem működik. Esetemben a dátum formátummal nem tudott mit kezdeni a régebbi IE8-9 és a Safari. Természetesen némi utánajárással, minden ilyen pontatlanság javítható.
A javascriptek esetén a függvények paramétereinek felsorolását jól zárjuk le. Népszerűbb hiba, hogy az utolsó paraméter után bent marad egy vessző. Nézzed még írás közben, mert utána macerás bogarászni és az adminok kiszúrják.
Már majdnem jó, de...
Jön az elkészült felületünk tesztelése. Minden működik, minden olyan, mint megálmodtuk. Most lássuk a validálást. Mindegy, hogy 30-20-10, vagy csak 1 hiba is van, mindet ki kell javítani. Ugyan ez igaz a böngészőkbe épített debugger használatával kapcsolatban.
Remek, minden ok, de kéne valami plusz!
Esetemben azt a kis pluszt találtam ki, hogy adok a sablon mellé egy dinamikus színkeverőt. Persze-persze ilyet tud másoké is, de én úgy alkottam meg, hogy ne csak kész színekből lehessen beállítani a szövegek, hátterek, kitöltő színek színkódjait, hanem a kikeverés után automatikusan elkészít és lement egy css fájlt a beállításokkal. Így a sablon büszke tulajdonosának nincs más dolga, csak ezt az elkészült css fájlt be kell importálnia a sablonba.
Dokumentálj, illusztrálj
Az elkészült forráskód és PSD mellé biztosítani kell egy nagyon körültekintő dokumentációt, mely elsősorban a végfelhasználóknak kell szóljon. Nagyon részletesen be kell mutatni az összes alkotóelem funkcióját és hogy ezeket hol és miként tudja a felhasználó testreszabni. Érdemes megjelölni a felhasznált fájlok, képek forrásait és verziószámát is felsorolni. Persze mindezt angol nyelven. Elkészthetjük PDF, vagy HTML verzióban is. Személyes tapasztalatom, hogy a HTML verziót preferálják jobban, mert könnyebben alakítható, illetve egészíthető.
Kész a látványterv, a kód és a dokumentáció és még...
Kell egy saját domain és tárhely, ahol be lehet mutatni az elkészült sablont. Ha az elkészített sablonnak több változata is van, akkor érdemes egy változat választó előoldalt is létrehozni. Esetemben 2 verzió volt: az egyiken váltóképek voltak a fejlécben háttérként, a másik verzióban pedig egy youtube videó töltötte ki ugyan ezt a szerepet.
Arra még érdemes figyelni, hogy a bemutató oldalt is értékelik, így a felhasznált képek legyen a lehető legjobb minőségűek. Ne használjunk fel engedély nélküli képeket, sőt az Envato csapat képeit sem, még akkor sem, ha a Flicker-ről származnak, mert kérhetik a lecserélésüket. Illetve a képek illeszkedjenek a sablonba, témájukat és színvilágukat tekintve is.
Továbbá készteni kell egy 80px X 80px ikont, ami a piactér listázásában jelenik meg, illetve egy 590px X 300px méretű előnézeti kép, ami a sablon adatlapján fog megjelenni.
Megmutatom képekben, hogy állunk eddig
Jöhet a beküldés
Első lépésben ki kell választani a sablon kategóriáját. Ez után meg kell adni a sablon nevét és leírását. Ezt követően ki kell választani a sablon paramétereit miszerint milyen böngészőkre van optimalizálva, miket tartalmaz a sablon, stb... Ha ezekkel is meg vagyunk fel kell tölteni 3 fájlt, melyeket a képeken illusztráltam is: thumbnail.png, sablon_egyben.zip, previews.zip
Ha azt hiszed, túl vagyunk a nehezén, akkor tévedsz! Eddig mindössze 2 és fél hét telt el. Lássuk mivel ütöttem el a többi időt. Az első 4 beküldést követően vártam 3-4 napot., majd ezt követően egy sablon válasszal visszautasították a sablont. 5 sablon válasza van a ThemeForestnek, amiről a válaszlevelükben adnak egy tájékoztatót, ami nagyjából pont ugyan ennyire semmit mondó. Szóval a konkrét hiba nem derült ki, de a fórumon azt a tanácsot kaptuk, hogy legyünk kitartóak. Nagyon minimális változtatásokkal újraküldtem a sablont.
Majd megtörtént a csoda! Az 5. feltöltést követően is visszadobták a sablont, de ezúttal csak egy úgynevezett soft reject-et kaptam. Vagyis a sablont elfogadták, felvették a rendszerbe, de még nem tudom értékesíteni, míg a megmaradt apróbb hibákat nem javítom. Ezúttal leírják pontosan, de nem szájbarágósan a hibát. Nos, most érdemes idefigyelni. Leírják a hibát, de nem fogják leírni melyik fájlban és melyik sorban van. Annyi biztos, hogy a hibát csak olyan fájlokban jelzik, melyeket mi magunk programoztunk le, tehát ezekben kell körülnézni.
Eljött a 6. feltöltés, újra figyelmeztetnek azokra a hibákra, amiknek a kijavításán elsiklottam. Semmi gond, ezúttal megtaláltam a hibákat. Ezek a fent vázolt hibák voltak, melyekkel sok időt lehet megspórolni, ha előre átnézzük.
Teljes megsemmisülés
Cikkem publikálásának idején épp a 9. feltöltésen vagyok túl. Sajnos megdöbbentő eredménnyel. Az adminisztrátorok már semmilyen hibát nem tudtak találni, egyszerűen csak közölték, hogy szerintük minden fáradozás ellenére a sablon nekik nem tetszik. Hát ennyi idő elteltével igen csalódott vagyok, de...
A makacs büszkeség diktálja, nem lehet feladni!
Felkerestem egy másik grafikus ismerőst, aki lát egy másik utat a sablon átalakításában, így megpróbáljuk azt a tervet véghezvinni. Ha azt sem fogadják el, akkor egyszerűen el kell fogadni, hogy ezzel a sablonnal nem tudunk felkerülni, ha úgy döntenek az adminisztrátorok. Ilyenkor se legyünk mérgesek, én se vagyok, hiszen nagyon sokat lehetett ebből is tanulni. Leginkább önfegyelmet. Most már tudom mennyi munka van egy ThemeForestre felkészített sablonnal és annak maximális finomításaival, de megéri megtanulni ezt a szellemiséget és a következő sablonnál, már ennyivel is több időt spórolok meg magamnak.
Azért bízom benne, hogy az új változat nagyobb sikereket arat, és végre be tudom mutatni a sablont nem csak Írogatni róla.
Összefoglalva ezekkel kell készülni a feltöltéshez
- Szükség lesz egy 590px x 300px felbontású előnézeti képre, ami a sablon adatlapján fog megjelenni.
- Egy 80px x 80px felbontású ikonra, ami a listanézetben fog megjelenni.
- További előnézeti képekre, melyekre az adminoknak mutatják a helyes kinézetet asztali gép, táblagép és mobil eszközökön.
- Erről a 3 nézetről a PSD.
- Egy jól kidolgozott, nagyon szájbarágós dokumentáció, mely tartalmazza a sablon felépítését, alkotóelemeit, forrásanyagait és a beállítási lehetőségeit közérthető nyelven.
- A dokumentációt, PSD-t és a teljes weboldal forráskódját egy zip-be kell tömöríteni és azt kell majd feltölteni.
- Fontos, hogy készít egy saját domaineden és tárhelyeden elérhető demo felületet, amit meg tudsz mutatni az érdeklődőknek. Az itt felhasznált képeket, ha nem rendelkezel olyan licensszel akkor csak a demo felületen használd fel, a feltöltött sablonba használj szürke helyettesítő képeket. Ezt érdemes jelezni egyébként a sablon adatlapján, hogy a demo oldalon szereplő képek csak illusztrációk, a megvásárolható sablon nem tartalmazza őket. Itt esetleg még a forrást meg lehet adni.