Térkép az ingatlan.com-on

Ez egy részben technológiai szemléletű, főként viszont személyes élménybeszámoló a napokban élesített legújabb fejlesztésünkről, az ingatlan.com térképes nézetéről, amely nagyjából fél év munkájának gyümölcse.

Honnan indultunk?

Amikor 2011-ben elkezdtem dolgozni az ingatlan.com-ot fejlesztő Arkonnál, hamar elindult egy elég nagy fejlesztés: meg akartuk csinálni az ország legjobb elhelyezkedés-adatbázisát. A motiváció érthető: ha a mi adatbázisunk a legjobb, akkor minden hirdetést pontos címmel tárolhatunk, és később könnyedén megjeleníthetünk a térképen. Akkoriban volt egy nagyon kezdetleges és egyszerű térképes nézet az oldalon, de egyrészt a háttérben egy rendkívül optimalizálatlan kód szolgálta ki, és akkoriban a szerverek sem voltak olyan állapotban, hogy elbírták volna a terhelést. Az már akkor látszódott, hogy a felhasználók nagyon szerettek volna térképen keresni, de a mérésekből azt is leolvastuk, hogy maximum 60 másodpercet töltöttek az oldalon, és mentek is át a hagyományos lista nézetre.

Az elhelyezkedések összegyűjtése egyszerű feladatnak tűnhet, de egyáltalán nem az. Magyarországon sajnos nagyon össze-visszák az alapok is: léteznek például városrészek, de sokszor még az ott lakók sem ismerik őket, mert a köznapi használatban ritkán kerülnek elő. Arról nem is beszélve, hogy egy utca háromféle adatbázisban háromféle irányítószámmal szerepel. A munkánkat nagyban segítette, hogy a csapatban van Szabó Paula térképész is, akitől az évek során én személyesen sokat tanultam a témáról (persze még mindig messze állok tőle), és aki nagyon sokat segített a projekt levezénylésében.

Időközben keresőmotort is váltottunk, az igényeinknek kevésbé megfelelő és nem annyira skálázható Sphinxet lecseréltük Apache Solr-re, ami egyébként nagyon jó döntésnek bizonyult így kicsit több mint egy év távlatából. Hosszas szenvedés, sok sikertelen nekifutás és rengeteg elfogyasztott fejlesztő után (azt hiszem, egész pontosan Gábor volt a negyedik, aki a projekten dolgozott, de szerencsére révbe ért) végül aztán elkészült az adatbázis, átállítottuk a rendszereket, vért izzadtunk pár estén át de »Mikulás napjára« élesítettük a fejlesztéseket.

Voltaképpen minden adott volt, hogy induljon a térkép elkészítése, de utána még más fejlesztések voltak fókuszban, és egyszer változott a csapatok összetétele is.

Milyen nehézségek voltak?

Egyrészt az elhelyezkedések (utcák, városok stb.) és a hozzájuk tartozó koordináták valamint befoglaló téglalapok adatainak hiánya. Ezeket a híres-neves adatbázis elkészítésével megoldottuk, de ott volt még a legnagyobb probléma: a felhasználók. Persze ne értsetek félre, imádom a felhasználóinkat, hiszen értük-nekik csináljuk az oldalt, de sajnos megküzdöttünk azzal a problémával, hogy az ingatlanügynökök rettenetesen féltik a hirdetéseikhez tartozó ingatlan pontos címét, sokszor volt már rá ugyanis példa, hogy cím alapján a vásárlók inkább megkeresték a hirdetőt személyesen, kihagyva a referenst.

Ennélfogva a hirdetések jelentős részéhez nincsen megadva cím (illetve, pontosítok: meg van adva, de a hirdetők kérésére mi azt kötelesek vagyunk elrejteni). Az pedig nagyon jó információ, hogy a hatodik kerületben van egy kiadó lakás, de nekem, mint térképen kereső felhasználónak, arra lenne szükségem, hogy melyik utca melyik sarkán van az a bizonyos lakás, különben bőven elég egy lista is. Itt nagyon sok dilemmánk volt, de végül arra jutottunk, hogy ha a felhasználó nem szeretné, hogy megjelenítsük a címet, akkor a térképen sem rakhatjuk ki pontosan a házikó ikont. A döntés így az lett, hogy település szinten (ez azt jelenti, hogy a térképen nagyjából egy egész település látszik) megjelenítjük egy buborékban a hirdetéseket, de ha közelebb megy a felhasználó, és már utcák is látszódnak, akkor csak külön, egy más grafikai elemmel, és kis magyarázattal a város vagy a kerület közepére tesszük az általunk csak pontatlan címűnek nevezett hirdetéseket.

Problémát jelentett még az is, hogy habár összeállt a csapat: Balázs, Gábor és személyemben volt három fejlesztő; Paula mint térképész; Hosszú Zoli mint grafikus, Dóka Máté és Ladnyik Miki mint profi tesztelők és persze Szűcs Ati, mint termékmenedzser valamint a csapat vezetője, azonban senki nem foglalkozott még ilyen mélyen térkép vonatkozású fejlesztésekkel, ráadásul mindenki inkább backenden mozgott otthonosan. Ismertük persze a JavaScriptet, azt is tudtuk, hogy a világ legfélreértettebb programozási nyelve, meg azt is hogy mi az a prototype, illetve nagyjából eligazodtunk az amúgy rémes OpenLayers dokumentációkban, de azért mégis.

Módszertan tekintetében hogyan fejlesztettünk?

Fent felsorolt ismereti nehézségekből kifolyólag kicsit megerőszakoltuk a Scrum módszertant, nevezetesen pedig azzal, hogy megbeszéltük, megtervezzük felhasználói szinten olyan részletesen a térképet, amennyire csak tudjuk, majd elkészítünk egy prototípust. A prototípus persze tele lesz hibával, közben rájövünk ötvenezer dologra, amire nem is gondoltunk, de: akkor már túl leszünk több száz óra fejlesztésen, és könnyedén át tudjuk írni kódot szebbre-jobbra, sőt, még esztimálást is tarthatunk, hiszen addigra már térképésszé programozzuk magunkat. Rizikós volt, féltünk, de a módszer bevált: néhány sprint alatt eljutottunk oda, hogy volt térkép, volt lista, voltak markerek is, mi pedig örültünk.

Aztán jött az igazán érdekes rész: másfél kéthetes sprint alatt három fejlesztőnek rendbe kellett tennie az egész kódot. Egy több mint ezer soros map.js fájlból végül csináltunk egy nyolc-tíz fájlból álló, jól strukturált, nagyrészt egységtesztelt és ami a legfontosabb: könnyen fejleszthető és újrahasznosítható kódot.

Amit én az egész fejlesztés alatt nagyon élveztem, hogy nem engedtük el a projektet. Sikerült elérnünk, hogy nagyon kevés más fejlesztéssel kellett foglalkoznunk, és élesítés után nem zuhantunk rá rögtön a következő feladatokra. Sokat agyaltunk, vitatkoztunk, beszélgettünk, próbáltunk a felhasználóink fejével gondolkodni.

ingatlan.com térképes nézet

Milyen technológiákat használunk?

OpenStreetMap: a térképünk adatait a nyílt forráskódú, felhasználók által szerkeszthető OSM-ből nyerjük. Ezzel kapcsolatban a legmenőbb élményem az volt, hogy Paula, a térképész kollégánk aktív tagja az OSM-közösségnek, így nagyon sok mindent ő maga javított vagy hozott létre a rendszerben. A térképet Hosszú Zoli szépen meg is dizájnolta.

OpenLayers: a böngészőben a térkép a szintén nyílt forráskódú library, az OpenLayers segítségével jelenik meg. Az OpenLayers gondoskodik továbbá a különböző, térképen megjelenő grafikai elemekről is.

Varnish Cache: a térkép csempékből áll, ezek egyszerű képek, amelyeket a megfelelő koordináta és nagyítási nézet szerint tölt be az OpenLayers. Ezen csempék kiszolgálását az ugyancsak nyílt forráskódú Varnish Cache segítségével támogatjuk.

Jasmine: JavaScript kódok egyszerű unit tesztelését teszi lehetővé, nagyon kényelmesnek és jól használhatónak bizonyult.

A kódokban használunk ma már mezeinek számító jQuery-t, a háttérben pedig a symfony 1.4-es keretrendszerben megírt PHP-kódok rángatják elő Solr-ből a különböző adatokat. A szerverek mélyén van még egy kis varázslás a térképcsempék generálásához.

Szintén technológiai érdekesség, hogy a fejlesztést feature switch segítségével vittük végig. Feature branch-et nem hoztunk létre, a szolgáltatás folyamatosan élestíve volt, eleinte csak a csapat, később csak a cég dolgozói, majd a bejelentkezett felhasználók érték el, mielőtt mindenki számára nyilvánossá tettük.

Hosszabb távon, ha indokolt lesz, tervezzük az Underscore.js bevezetését is, de egyelőre nem került rá sor.

Merre tovább?

Természetesen nem állunk le, most, hogy a fejlesztés éles, természetesen gőzerővel javítjuk a hibákat, illetve oldjuk meg az olyan problémákat, amelyek nem számítanak hibának, viszont a felhasználók visszajelzése alapján nem kényelmes vagy nehezen érthető.

És végül egy személyes gondolat: azért is örülök, hogy részt vehettem ingatlan.com térképes nézetének fejlesztésében, mert a fent felsoroltakon túl (vagy inkább azok eredményeként) úgy érzem, hogy ingatlanok keresésére az országban elérhető legjobb térképes nézet érhető el két kattintással, az országban elérhető legjobb ingatlankeresőn. És ezt egyáltalán nem mint arkonos, vagy mint fejlesztő, szigorúan mint felhasználó gondolom így, a rendszer minden ismert hibája ellenére. Abban pedig a marketingbullshitet mellőzve tényleg hiszek, hogy ezzel megkönnyítjük az otthont, irodát, nyaralót vagy fejlesztési területet keresők munkáját.

Szóval, kattintgassátok, nagyítsátok, használjátok, a konstruktív vélemények pedig jöhetnek e-mailben, kommentben és mindenféle egyéb csatornán!



12 hozzászólás

  • Ademaro

    2013. november 22. napján, 13:21-kor

    Rögtön betöltődött a hirdetésemen a kis narancs jel. És még az utca jó oldalán is van, pazar:)
  • Mefi

    2013. november 22. napján, 13:30-kor

    Ademaro: örülünk! :)
  • Drusantia

    2013. november 22. napján, 16:35-kor

    Szia, nekem sajnos nem tölt be (Chrome 31.0.1650.57 m), de majd még később ránézek, mert érdekel :) Illetve egy pillanatra felvillan, aztán mintha háttérbe szorulna és csak fehér képet látok a térkép helyén.
  • Drusantia

    2013. november 22. napján, 16:37-kor

    IE-vel bejött, nagyon jó lett :)
  • Béla

    2013. november 23. napján, 11:40-kor

    Na most akkor fejlesszétek le mindezt a Street View-ra is! Még karácsonyig! :D :D :D
  • kukac7

    2013. november 24. napján, 21:11-kor

    miert nem leafletjs?
  • Marcell

    2013. november 27. napján, 15:24-kor

    Mint (éppen valós) felhasználó, én azért sokat szívok a portállal. Az Albérlet.hu egy kalap szar, az Ingatlan.com mondjuk jobb, de ez is mindig felbosszant, ha rámegyek.

    Ha pl ezt nézem http://goo.gl/ix7bCK :
    - Kiírja, hogy Üllői út: 1db, rákattintok és elkezd bezoomolgatni, ahelyett hogy jobb oldalt listázná azt az egy szem találatot... Minek? Majd ha akarok, bezoomolok, így csak összezavartok, mert szűkül a látóterem, és zoomolhatok vissza, semmi szükségem rá.
    - Jó lenne látni a kis pöttyök "pontatlanságát" az összesítő térképen is, tehát azt, ami az adatlapos nézetnél megjelenik mint külső 90%-osan átlátszó körterület (jelenjen meg pl hoverre). Hogy legalább azt lássam, legrosszabb esetben mennyire van messze attól a ponttól, ami kamuként oda van rakva.
    ( - Amúgy pedig az ingatlanosok sz*pjanak lovat és mondják meg a pontos címet. A Google sem olyan találatokat ad, hogy a_l_k_s_r_f, hanem kiírja, hogy ablakzsiráf, ha rákeresel.)

    Más:
    - Miért nem lehet megnyomni egy gombot login után, hogy: "ezt a szart már láttam" és onnantól az a lakás többet ne jöjjön fel a listákban. Újra és újra ugyanazokat dobálja fel a portál, már 100x átnéztem, nem kell, de utána is ezzel idegesít. Én meg persze 3 nappal későbbre újra elfelejtem, a kis mütyűr fotóból semmi sem látszódik és megint rákattintok, húzzátok az időmet, én meg zabálom a sávszélességet nálatok, tök feleslegesen.
    - Miért nincs kiírva, mikor tették fel azt a retkes hirdetést? Sokszor nem veszik le, de már baromira nem aktuális és azt nézegetem (lásd előző probléma), ha meg valami tényleg friss, jó lenne tudni róla. Jól sejtem, hogy itt valami marketing okoskodás miatt szopatjuk a felhasználókat, higgye csak, hogy minden friss?
  • Mefi

    2013. november 28. napján, 02:55-kor

    Drusantia: szia! Még mindig fennáll a probléma? :)

    Béla: először tanuljon meg járni, aztán mehet az űrbe! :D

    kukac7: jó kérdés, nem tudom, az elejétől fogva az OpenLayers volt terítéken, a Leaflet-et is megnéztük, de nem mélyedtünk el a dologgal.

    Marcell: teljesen jogos dolgokat írtál, reagálnék is.

    Bezúmolós témakör: éppen most zajlik egy fejlesztés, ami ezt fogja megoldani, nagyjából hasonlóképpen, ahogy te is írtad.

    Pontatlan hirdetések: ezekhez sajnos nem tudunk semmi ilyen információt. A júzer megadja, hogy I. kerület Mészáros utca, nekünk van egy koordinátánk a Mészáros utca közepére, és ennyi. Ha kéri, hogy rejtsük el az utcát vagy a házszámot, akkor nem jeleníthetjük meg, mert azzal megsértjük az adatkezelési szabályokat.

    Az ingatlanosok: persze, mondhatnánk, hogy csak magánjúzerekkel foglalkozunk, de az ingatlan.com pont azért piacvezető, mert tud tartani egy egészséges arany középutat, ahol nem sérül nagyban sem az ingatlanos, sem a magánhirdető sem pedig a hirdetéseket böngésző felhasználói élménye. Nálunk van a legtöbb hirdetés, cserébe vannak kompromisszumok.

    Már láttam a hirdetést: jó ötlet, köszi, beszélni fogunk róla!

    Dátum: régen ki volt írva, de sok júzer visszaélt vele, törölték majd újra feladták a hirdetést, így úgy tűnt, mintha friss lenne.
  • Marcell

    2013. december 02. napján, 14:55-kor

    Mefi: a "Pontatlan hirdetések"-nél nem értetted meg, amit írtam. Tudom, hogy pontosan nem lehet megjeleníteni a házszámot. De legalább a becslés hibahatárát mutassátok meg - vizuálisan ez a középpont körüli 90%-osan átlátszó kör sugara. Ezt az adatlapon már sikerült megoldanotok (amennyiben az nem kamu adat), tehát technikailag nem lehet akadálya ugyanezt megjeleníteni a listázó nézet térképén is.

    Szépen kihátráltál a dátumos résznél... Az, hogy páran visszaélnek vele, még nem jelentheti azt, hogy akkor szarjunk bele, ha 10% csal, attól még a maradék 90%-nál jó. A csalásokat pedig meg kell próbálni kiszűrni: pl egy hirdetőnek egy utcában csak egy hirdetése lehet. Vagy több, de azt már monitorozza a rendszer és előbb-utóbb figyelmeztet, bünti lesz. Nem hiszem, hogy nekem kellene tanácsokat adnom egy 60 fős cégnek, bár ahogy látom épp hiány van: http://arkon.hu/#allas_online-termekmenedzser

    Ma is sikerült felidegesítenie az oldalnak... Egy dolgot akarok, de úgy látom 2013-ban nem tudjátok megoldani: ha tegnap voltam rajta, és ma újra rámegyek, mutassa meg azt, ami tegnap óta új és a többi szartól kíméljen meg. Ezt lehetne dátum alapú sorrendezéssel, lehetne "már láttam" gombbal, lehetne júzerhez kapcsolt látta/nemlátta ikonnal (adatbázissal) is megoldani, de egyik sincs.

    Arkon.hu: "Tizenöt éve lehetünk büszkék rá, hogy magyar tulajdonú cégben, Magyarországon hozunk létre világszínvonalú és szerethető webes szolgáltatásokat" - jó a duma, kár hogy csak mese.

    És egy újabb felesleges felhasználó szopatás: be vagyok lépve, mégis ki kell töltenem a nevemet, e-mail címemet az "E-mail a hirdetőnek" bal oldali dobozban, mintha a rendszer nem tudná amúgy is magától. Ja és minden egyes alkalommal meg kell adnom captcha-t is, mert amúgy biztos unatkoznék.
  • Mefi

    2013. december 03. napján, 01:36-kor

    Marcell: most belemehetünk abba, hogy te felsorolsz olyan dolgokat, amik szerinted rosszul működnek az oldalon, én pedig elmondom emögött az értelmes és kézzel fogható indokokat. A Facebookon ötvenszer annyi fejlesztő dolgozik, mint az Arkonnál összesen, mégis napi szinten találok benne számomra érthetetlen vagy hibás működést. Neked lehet, hogy úgy tűnik, 10% csal valamivel, de hidd el, hogy minden ilyen működés vagy szolgáltatás hátterében alapos és megfontolt üzleti döntés áll.

    A pontatlan hirdetéseknél rakhatnánk karikát, de az a karika egyszerűen az utca középpontja köré van rajzolva, semmi köze ahhoz, hogy hol van a hirdetés (csak annyiban, hogy valahol abban az utcában). Ilyenkor tényleg nem tudunk semmilyen koordinátát, csak azt, hogy melyik utcában van a hirdetés. Ezért pontatlan.

    A dátumnál nem 10%-os csalás volt, és sajnos egy hirdetőnek egy utcában nem lehet csak egy hirdetése, van olyan ingatlanközvetítő, aki több tucat ingatlant árul egyszerre. Meg amúgy is: mit szűrsz azzal ki, ha egy utcába egyszer töltenek fel? (Egyébként meg gondolj bele, egy percnyi munkám lenne holnap kirakni a dátumot, nem véletlenül nincs ott.)

    A már láttam funkció tényleg hiányzik.

    Az adatok kitöltésének hiánya valószínűleg egy bug, ránézünk. Az üzenőboxon keresztül pedig még a captcha ellenére is befér egy-két spam, ha azt a captchát levennénk, elárasztanák a hirdetőket a kamu érdeklődők. :)

    (Arra a részre pedig, hogy mese és duma, különösebben nem reagálok, mert én lassan három éve dolgozom az Arkonnál, tudom, hogy mi a mese és a duma, ez éppenséggel nem az.)
  • Marcell

    2013. december 25. napján, 21:37-kor

    "minden ilyen működés vagy szolgáltatás hátterében alapos és megfontolt üzleti döntés áll"

    VS

    "A már láttam funkció tényleg hiányzik."
    "Az adatok kitöltésének hiánya valószínűleg egy bug, ránézünk."

    Igazából magadnak mondasz ellent a hozzászólásodban, de nincs kedvem tovább vitázni. :D Gondoltam megírom, hogy végül találtam új albérletet, és igen, az ingatlan.com-on keresztül. Ettől függetlenül azt gondolom, amiket felsoroltam problémák, minden egyes belépéskor komolyan megnehezítették a dolgomat és simán meg lehetne oldani őket ha akarnátok.
  • Mefi

    2013. december 26. napján, 22:32-kor

    Marcell: nem ellentmondok, csak vannak dolgok, amiket nem írhatok le, mint ahogyan az iPhone 6-ot sem illik kihozni a műhelyből, ha érted. :) Bugok pedig minden rendszerben vannak, akármilyen nagy odafigyeléssel foglalkoznak velük, ne tegyél úgy, mintha ezt nem tudnád!

Szólj hozzá!

A nevedet és az e-mail-címedet mindenképpen add meg. Az e-mail-címed nem jelenik meg.

Ez a weboldal az Akismet szolgáltatását használja a spam kiszűrésére. Tudjunk meg többet arról, hogyan dolgozzák fel a hozzászólásunk adatait..