FlyStartup – responsive web design

Iako je FlyStartup zamišljen kao blog, on je to odavno prestao biti. Da, slažem se, i dalje se sve vrti oko bloga, iznošenja mišljenja, upozoravanja budućih poduzetnika što ih može očekivati na trnovitom putu do slave i uspjeha. FlyStartup je u međuvremenu izrastao u malu tvrtku koja u ovom trenutku zapošljava troje vrijednih ljudi koji svakodnevno rade na projektima o kojima se prije godinu dana moglo samo razmišljati u “best case” scenariju.

Tko smo mi?

Razlog za izradu nove internetske stranice i odmicanje od koncepta “samo blog” su upravo ti vrijedni ljudi koji su i doprinijeli na razvoju ove male tvrtke. Osnovna djelatnost kojom se želimo predstaviti svijetu je, naravno, Software Development. Osim toga, uspješno smo organizirali jednu edukaciju, ali i odradili nekoliko uspješnih projektiranja informacijskih sustava (dakle, i dalje se držimo software developmenta kao snažnog pokretača ove naše male tvrtke).

Nikako ne želimo biti percipirani kao “još jedna tvrtka koja radi internet stranice” jer mi to definitivno nismo. Želimo da nas se percipira kao tvrtku koja svojom stručnošću i sposobnošću može, uz pomoć svojih partnera, odraditi srednje i srednje velike projekte, koji obuhvaćaju analizu, projektiranje, iskoristivost i izgradnju poslovno-informacijskih sustava koji se mogu jednako uspješno pokrenuti na mobilnim telefonima, tablet uređajima i osobnim računalima. Kao partneri naših budućih klijenata ne želimo dovoditi u pitanje tehnologiju, jer ona je i onako sporedna u provedbi klijentovih želja u djelo.

Responsive web design

Nismo sigurni hoće li vam se svidjeti ovaj predložak internetske stranice kojeg smo napravili kako bismo se istaknuli iz gomile drugih, no ukoliko vam se svidi, moći ćete ga implementirati na svojem WordPress sustavu (naravno, molimo vas samo da ga modificirate u smislu boja, tekstura, i fontova).

Prilikom izrade predloška vodili smo se trendovima koji su aktualni u 2013. godini:

  1. responsive dizajn
  2. jednostavan dizajn
  3. velika tipografija (korištenje velikih fontova)
  4. fiksirani izbornik na vhu
  5. CSS transparencije
  6. digitalni QR kod (Izgeneriran ovdje: http://goqr.me/)
  7. jQuerry, HTML 5, CSS3
  8. neizostavne ikone za društvene mreže
  9. mobilna navigacija
  10. CSS 3 animacije
  11. kružno dizajnirani elementi

Za “podlogu” na kojoj je sve ovo napravljeno korišten je WordPress i tema koja je u potpunosti prerađena, a dolazi standardno s instalacijom WordPressa. Riječ je o temi Twenty Twelve. 

Ovaj modificirani Twenty Twelve možete skinuti ovdje, a postavke početne / o nama / kontakt stranica možete pokupiti iz ovih niže navedenih HTML elemenata (molimo vas samo da prilikom copy / paste-a izmjenite sadržaj, te prilagodite vašem webu):

HTML kod za podstranicu – Početna –

<div class="fullwidth" id="outermain">
<div class="container">
<div class="row"><section class="twelve columns" id="maincontent"><section class="content">
<div class="row textCenter">
<div class="one_third columns">
<h2>Projektiranje Software-a</h2>
Na području razvoja softvera, desktop i mobilnih aplikacija, Flystartup je jedna od boljih i stručnijih tvrtki. Uz praktično znanje i iskustvo pružamo obuku Btech/MCA/BCA/studentima za web i Android development, web dizajniranje i CMS. Uz tehnološku podršku nudimo savjetovanje i strategiju za vaše projekte.

<a class="button" href="#">Opširnije</a>

</div>
<div class="one_third columns">
<h2>Edukacija</h2>
Edukacija je sastavni dio i poslovnog i privatnog života. U današanje vrijeme znanje stečeno na edukacijama je postalo prednost i dodatna vrijednost kako za organizaciju, tako i za zaposlenika organizacije. Potiče produktivnost i podiže zadovoljstvo zaposlenika, a za tvrtku predstavlja opravdani trošak.

<a class="button" href="#">Opširnije</a>

</div>
<div class="one_third columns">
<h2>Startup tvrtke</h2>
Želite ili morate biti sam svoj gazda, a imate niz nedoumica i pregršt pitanja? Ne znate odakle biste krenuli? Imate ideju, već ste se odlučili za realizaciju i samo tražite dodatan poticaj i motivaciju? Imate vlastiti biznis i želite napraviti promjene – povećati prodaju, poboljšati uslugu, smanjiti troškove, zamijeniti ljude?

<a class="button" href="#">Opširnije</a>

</div>
</div>
<div id="ts-display-shortcode">
<div class="header-wrapper">
<h2>Trenutno radimo</h2>
</div>
<div class="row">
<div class="one_fourth columns item wordpress">
<div class="ts-display-pf-img"><a class="image" href="http://flystartup.com/wp-content/uploads/2013/09/edukacija-121.jpg" data-rel="prettyPhoto[mixed]">

<img alt="" src="http://flystartup.com/wp-content/uploads/2013/09/edukacija-121.jpg" />
</a></div>
<div class="ts-display-pf-text">
<h2><a href="#">FlyAcademy</a></h2>
FlyAcademy je projekt obrazovnog tipa koji je proizašao iz potrebe kontinuiranog obrazovanja i usavršavanja u programiranju.

</div>
<div class="ts-display-clear"></div>
</div>
<div class="one_fourth columns item design">
<div class="ts-display-pf-img"><a class="image" href="http://flystartup.com/wp-content/uploads/2013/09/erp-sustav21.jpg" data-rel="prettyPhoto[mixed]">

<img alt="" src="http://flystartup.com/wp-content/uploads/2013/09/erp-sustav21.jpg" />
</a></div>
<div class="ts-display-pf-text">
<h2><a href="#">Projektiranje IS-a</a></h2>
Cloud-based multimodularan informacijski sustav za vođenje i upravljanje tvrtkom u koju je integrirana web prodaja.<span style="line-height: 1.714285714; font-size: 1rem;"> </span>

</div>
</div>
<div class="one_fourth columns item wordpress">
<div class="ts-display-pf-img"><a class="image" href="http://flystartup.com/wp-content/uploads/2013/09/consulting-221.jpg" data-rel="prettyPhoto[mixed]">

<img alt="" src="http://flystartup.com/wp-content/uploads/2013/09/consulting-221.jpg" />
</a></div>
<div class="ts-display-pf-text">
<h2><a href="#">Consulting</a></h2>
Imate ideje, a ne znate kako ih realizirati. Oduvijek ste htjeli postati poduzetnik, ali niste znali kako i odakle krenuti...

</div>
<div class="ts-display-clear"></div>
</div>
<div class="one_fourth columns item photography">
<div class="ts-display-pf-img"><a class="image" href="http://flystartup.com/wp-content/uploads/2013/09/Networking-111.jpg" data-rel="prettyPhoto[mixed]">

<img alt="" src="http://flystartup.com/wp-content/uploads/2013/09/Networking-111.jpg" />
</a></div>
<div class="ts-display-pf-text">
<h2><a href="#">Networking</a></h2>
Cloud-based sustav za povezivanje i organizaciju startup tvrtki.

</div>
<div class="ts-display-clear"></div>
</div>
</div>
<div class="clear"></div>
</div>
<div class="row">
<div class="one_half columns">
<h2>Zašto odabrati FlyStartup</h2>
Netko bi rekao da smo previše predani i entuzijastični u poslu koji radimo, ali mi volimo ono što radimo. Posvećeni smo svome poslu kako bismo vam dali najbolju moguću uslugu i proizvod, što ćemo vam i dokazati. Svaki klijent je jedinstven, svaka situacija je drugačija.
<ul class="list colortext">
	<li>Stojimo iza našeg posla.</li>
	<li>Pružamo vrhunsku uslugu.</li>
	<li>Koristimo najnovije tehnologije.</li>
	<li>Poštujemo rokove!</li>
</ul>
</div>
<div class="one_half columns">
<div class="header-wrapper">
<h2>Događanja</h2>
</div>
<div class="row">
<div class="one_half columns"><article class="post-shortcode">
<div class="shadow"><img alt="" src="http://flystartup.com/wp-content/uploads/2013/09/KulenDay-small.jpg" /></div>
<div class="posttitle"><a href="http://www.kulendayz.com/Agenda/Session/315">KulenDayz</a></div>
iOS 7 was unveiled during the opening keynote of the Apple Worldwide Developers Conference (WWDC) on June 10, 2013....

</article></div>
<div class="one_half columns"><article class="post-shortcode">
<div class="shadow"><img alt="" src="http://flystartup.com/wp-content/uploads/2013/09/FlyAcademy-small-1.jpg" /></div>
<div class="posttitle"><a href="single.html">.Net Academy</a></div>
FlyAcademy je osmišljen tako da pruža različite edukacije i tečajeve iz IT segmenta. Prva u nizu edukacija u sklopu ovog projekta je .NET 4.5 akademija...

</article></div>
</div>
</div>
</div>
</section></section></div>
</div>
</div>

HTML kod za podstranicu – O nama –

<div style="padding-right: 17px;">
<div class="padcontent"><section class="content">FlyStartup je tvrtka koja je nastala kao produkt ideja za nove poduzetnike i one koji to žele postati. Tvrtku je osnovao Krunoslav Ris koji kroz blog iznosi svoje dugogodišnje iskustvo kao zaposlenik i kao poduzetnik. Tvrtka je osnovana 13.01.2013. god. Osnovna misao vodilja kojom smo se vodili prilikom otvaranje tvrtke je da pomognemo tvrtkama u nastajanju kroz  primjere koje smo osjetili na vlastitoj koži.</section><section class="content"></section><section class="content"></section><section class="content"></section><section class="content"></section><section class="content"></section><section class="content">Kako se blog razvijao, te kako je broj postova narastao odlučili smo proširiti našu djelatnost te početi osim savjetovanja uslužno raditi i project management te arhitekturu informacijskih sustava.<img class="aligncenter" alt="" src="http://flystartup.com/wp-content/themes/twentytwelve/images/img-about.png" /></section><section class="content"></section><section class="content">Na području razvoja softvera, desktop i mobilnih aplikacija, Flystartup je jedna od boljih i stručnijih tvrtki. Uz praktično znanje i iskustvo pružamo obuku Btech/MCA/BCA/studentima za web i Android development, web dizajniranje i CMS. Uz tehnološku podršku nudimo vam savjetovanje i strategiju za vaše projekte.
<div class="separator"></div>
<h3>Koje su naše kompetencije?</h3>
<a href="http://flystartup.com/tko-smo-mi/krunoris/" rel="attachment wp-att-1944"><img class="alignleft" style="border: 2px solid #DBDBDB;" alt="krunoRis" src="http://flystartup.com/wp-content/uploads/2013/08/krunoRis.png" width="201" height="202" /></a>

Krunoslav Ris (CEO) diplomirao je poslovnu informatiku.
Senior Software Developer sa devet godina radnog iskustva (kojeg je "pekao" na  projektima za međunarodnu korporaciju) u IT sektoru trenutno zainteresiran za poduzetnički networking i nove poslovne izazove. Obožava iz ničega kreirati nešto, zato je osnovao Flystartup koji se bavi edukacijom, networkingom, Project Managmentom i izgradnjom arhitekture informacijskih sustava.
U slobodno vrijeme druži se s obitelji i prijateljima. Vođen životnim motom “<strong>La vita e bella</strong>”, truditi se na jednostavan način koračati kroz poslovni svijet. Gavne specijalnosti tu mu: Product Management, Strategic Planing, Solution Consulting, Keeping Timeline, Reducing Efforts.

Možete me pronaći na: <span style="color: #df514a;"><a href="http://www.facebook.com/kruno.ris"><span style="color: #df514a;">Facebook</span></a></span> | <span style="color: #df514a;"><a href="hr.linkedin.com/in/krunoslavris/"><span style="color: #df514a;">LinkedIn</span></a></span> | <span style="color: #df514a;"><a href="https://twitter.com/KrunoslavRis"><span style="color: #df514a;">Twitter</span></a></span>
<div class="separator"></div>
<a href="http://flystartup.com/tko-smo-mi/krunoris/" rel="attachment wp-att-1944"><img class="alignleft" style="border: 2px solid #DBDBDB;" alt="krunoRis" src="http://flystartup.com/wp-content/uploads/2013/09/sanja-siva.jpg" width="201" height="202" /></a>

Sanja Sabo-Ris (Content Manager) je diplomirala na Filozofskom fakultetu u Osijeku i stekla naziv diplomirane knjižničarke i profesorice hrvatskoga jezika i književnosti. Radila je kao urednica i lektorica internet portala. Predavala je u osnovnoj i srednjoj školi i radila kao stručna suradnica knjižničarka. Slobodno vrijeme najradije provodi na biciklističkm rutama od stotinu kilometara, fitnessu i “kemijajući” prirodnu kozmetiku.

Možete me pronaći na: <span style="color: #df514a;"><a href="http://www.facebook.com/sanja.saboris"><span style="color: #df514a;">Facebook</span></a></span> | <span style="color: #df514a;"><a href="hr.linkedin.com/pub/sanja-sabo-ris/80/847/b16"><span style="color: #df514a;">LinkedIn</span></a></span>

&nbsp;
<div class="separator"></div>
<a href="http://flystartup.com/tko-smo-mi/krunoris/" rel="attachment wp-att-1944"><img class="alignleft" style="border: 2px solid #DBDBDB;" alt="krunoRis" src="http://flystartup.com/wp-content/uploads/2013/09/Zrinkadakic.png" width="201" height="202" /></a>

Zrinka Dakić (Project Manager), diplomirala je informatiku na Elektrotehničkom fakultetu Osijek. Dodatno obrazovanje prošla je na Filozofskom fakultetu i postala licencirana predavačica. Ubrzo se zapošljava u privatnoj školi Ivora kao voditeljica obrazovnog centra. Dvije godine radi u školi na organizaciji predavanja, upisa i marketinga, a kasnije postaje i predavač za managerska zanimanja. Svojim zalaganjem i radom usmjerava se prema projektima EU gdje uspješno radi na provedbi IPA programa, “Mladi na djelu”, "Programi za cjeloživotno učenje". Radi na projektima međunarodne suradnje. Prolazi dodatne edukacije za pisanje i provedbu projekata. Tako dolazi i do Flystartupa gdje kao Project manager radi na pisanju, provedbi i upravljanju  projektima. Živi uz moto “Mens sana in corpore sano” pa joj je slobodno vrijeme rezervirano za aerobik i čitanje dobre knjige. Također uživa u dobrom šopingu, druženjima i putovanjima.

Možete me pronaći na: <span style="color: #df514a;"><a href="https://www.facebook.com/zrinka.dakic"><span style="color: #df514a;">Facebook</span></a></span> | <span style="color: #df514a;"><a href="http://www.linkedin.com/pub/zrinka-dakic/29/1a4/a40"><span style="color: #df514a;">LinkedIn</span></a></span> | <span style="color: #df514a;"><a href="https://twitter.com/zrinkadakic"><span style="color: #df514a;">Twitter</span></a></span>

<!-- <a href="http://flystartup.com/tko-smo-mi/krunoris/" rel="attachment wp-att-1944"><img class="alignleft" alt="krunoRis" src="http://flystartup.com/wp-content/uploads/2013/08/krunoRis.png" width="201" height="202" /></a>Zrinka Dakić (Project Manager), diplomirala je informatiku na Elektrotehničkom fakultetu Osijek. Dodatno obrazovanje prošla je na Filozofskom fakultetu i postala licencirana predavačica. Ubrzo se zapošljava u privatnoj školi Ivora kao voditeljica obrazovnog centra. Dvije godine radi u školi na organizaciji predavanja, upisa i marketinga, a kasnije postaje i predavač za managerska zanimanja. Svojim zalaganjem i radom usmjerava se prema projektima EU gdje uspješno radi na provedbi IPA programa, “Mladi na djelu”, "Program za cjeloživotno učenje". Radi na projektima međunarodne suradnje. Prolazi dodatne edukacije za pisanje i provedbu projekata.Živi uz moto “U zdravom tijelu, zdrav duh” pa joj je slobodno vrijeme rezervirano za aerobik i čitanje dobre knjige. Također uživa u dobrom šopingu, druženjima i putovanjima.

</section></div>
</div>
-->

</section></div>
</div>

HTML kod za podstranicu – Kontakt –

<table class="con">
<tbody>
<tr>
<td style="width: 193px;">
<div style="background: url('http://jabuke-ruze.com/media/mapa-back-1.png') no-repeat scroll left top transparent; padding-bottom: 320px; padding-left: 22px; padding-top: 15px;"><iframe width="570" height="265" style="padding-right: 15px; float: left;" src="https://maps.google.hr/maps?q=osijek+bios&amp;oe=utf-8&amp;client=firefox-a&amp;channel=fflb&amp;ie=UTF8&amp;hl=hr&amp;hq=bios&amp;hnear=Osijek,+Osje%C4%8Dko-baranjska+%C5%BEupanija&amp;ll=45.564769,18.63322&amp;spn=0.021575,0.137048&amp;t=m&amp;output=embed&amp;iwloc=near" frameborder="0" marginwidth="0" marginheight="0" scrolling="no"></iframe></div>
<div style="float: left; width: 30%;">
<table>
<tbody>
<tr>
<td style="padding: 0px;"><span style="color: #c2151b; font-weight: bold;"><a href="http://flystartup.com/kontakt/qrcode-fly-2/" rel="attachment wp-att-2068"><img class="aligncenter size-full wp-image-2068" alt="qrcode-fly" src="http://flystartup.com/wp-content/uploads/2013/08/qrcode-fly.png" width="173" height="173" /></a></span></td>
</tr>
</tbody>
</table>
</div>
<div style="float: left; margin-left: 3%; width: 30%;">
<table>
<tbody>
<tr>
<td style="padding: 0px;"><strong><span style="color: #e85244;">Leteći start:</span></strong></td>
</tr>
<tr>
<td style="padding: 0px;"><span style="font-size: inherit;">
<strong>A:</strong> 31000 - Osijek - J.J. Strossmayera 341</span></td>
</tr>
<tr>
<td style="padding: 0px;"><strong>T:</strong><span style="font-size: inherit;"> +385 (0)99 444 9949</span></td>
</tr>
<tr>
<td style="padding: 0px;"><strong>Informacije:</strong><span style="font-size: inherit;"> info@flystartup.com</span></td>
</tr>
</tbody>
</table>
</div>
<div style="float: left; margin-left: 3%; width: 33%;">
<table>
<tbody>
<tr>
<td style="padding: 0px;"><span style="color: #e85244; font-weight: bold;">Radno vrijeme:</span></td>
</tr>
<tr>
<td style="padding: 0px;">Ponedjeljak do petak, 08-16h</td>
</tr>
<tr>
<td style="padding: 0px;"><strong>ŽR:</strong> Zagrebačka banka: 2360000 - 1102318365 </td>
</tr>
<tr>
<td style="padding: 0px;"><strong>OIB:</strong> 46307988000 </td>
</tr>
<tr>
<td style="padding: 0px;"><strong>Sjedište tvrtke:</strong> J.J. Strossmayera 341, Osijek</td>
</tr>
</tbody>
</table>
</div>
<div style="margin-top: 250px;">


Pošaljite nam upit, ili nas barem pozdravite 🙂

* obavezna polja
</div></td> </tr> </tbody> </table>

Pozadinska ponavljajuća tekstura (Background)

Pozadinska fotografija (ponavljajuca)

Nadam se da vam se sviđa ovaj odličan responsive template kojeg smo za vas napravili. Želio bi da nam u komentaru ostavite “varijacije” na temu ovog template-a kojeg ste vi napravili.

Carpe Diem!

 

 

 

Ostavite komentar

Ako vam je ovaj članak bio dobar, ostavite neki komentar 🙂 ili se pretplatite na RSS kanal.
Krunoslav Ris
Umjetnička duša. programer, gurman i filantrop. Radi i živi u Osijeku. Nekad je bio samo programer, a danas se više zanima za poduzetništvo,marketing i društvene mreže. Gadgeti ga oduševljavaju otkako je koristio prvi Atari 2600, a posebno se voli klanjat Mac kultu.