+ fler guider ×
Bli medlem
Inloggad som ...
Inloggningstid: ??

MonthJune 2017

Vårt sista nyhetsbrev på communityn

I dagarna har jag spammat 2000 gamla avstängda användare på FFUs community, vissa som inte varit aktiva på många många år. Anledningen är att vi firar 20 år i år och jag önskar aktivera de få som har lust att bli aktiva igen. Kanske inte primärt via communityn, men gärna via andra kanaler så som Twitter och Facebook, och våra guider.

Nej då, communityn kommer inte läggas ner, men mycket oanvänd funktionalitet kommer att pensioneras. Vissa saker har legat och skräpat i många år. Likaså användare. Allt detta ska raderas. Men några har faktiskt bara glömt oss medan livet fortsatt susa vidare. Dessa önskar vi ge en sista chans att ta upp kontakten med oss igen.

Detta är brevet jag skickade ut (och redan nu har vi fått nya följare på Twitter och fans på Facebook):

Vårt sista nyhetsbrev? | Communityn på FFUniverse.nu

Hej,

Detta är mycket troligen det enda nyhetsbrev jag skickar dig. För väldigt många år sedan – kanske över 15 år sedan till och med – registrerade du ett medlemskap på svenska Final Fantasy-gemenskapen FFUniverse.nu

Minns du inte oss? Det är ok. Jag minns inte vad jag gjorde igår, än mindre för 15 år sen. Vi har inte dött eller gått under, vi lever och skriver guider fortfarande. Bland annat för FF15, FF7-remake, FF12 remastered, och en massa annat!

I år – i november – fyller vi 20 år. Det är inte överdrivet många sajter på internet som hållit sig flytande så länge. Detta önskar vi så klart att fira stort med våra vänner.

Är du intresserad av att ta del av detta och fortfarande vara vän med oss så önskar vi att du gör något av följande (eller alla tre) för att fortsätta hålla kontakten (vi kommer inte skicka fler såna här brev):

* Följ oss på Twitter – https://twitter.com/FFUniverse_nu
* Gilla vår sida på Facebook – https://www.facebook.com/ffuniverse.nu/
* Vår community – http://www.ffuniverse.nu/community/

Och logga gärna in på communityn igen (begär glömt lösenord om du inte minns). Då ser vi att du är aktiv och vi kan ta med din användare till framtida system. Vi gör nämligen stora arbeten på sajten för att uppdatera gammal teknologi, och dessvärre ser vi att det mesta måste kastas ut och bytas ut mot något nytt. Alla inaktiva användare kommer då försvinna.

Så, om du bara blev irriterad för detta mail så behöver du inte göra nånting, det kommer inte fler. Blev du glad och vi väckte nåt gammalt gott minne hos dig – bli vän med oss igen, släpp in oss i värmen!

Med vänliga hälsningar,
Bobby Westberg – Webmaster

Ny spelväljare/guideväljare lanserad

Vi har pratat om det tidigare och haft planerna på det länge, men så plötsligt fick jag lite tid över och kunde bygga och färdigställa vår nya guideväljare (en slags karta med alla FF-spelens logos, som man kunde klicka på för att komma till det spelets guide/sajt).

I många år låg denna guideväljare som en del på nyhetssajten, på /games.aspx. Inte så logiskt eller enkelt att komma ihåg. Mer logiskt var ju så klart att ha den som en helt egen sida, och i “root” på vår nya fina femåriga guide-server, på guide.ffuniverse.nu/. Men där hade vi lagt upp vår blogg. Efter många om och men så fick vi den flyttad, och då öppnade sig möjligheterna för att skapa vår nya guideväljare.

Ny design

Den har en enkel design. En lätt svag gråblå färg i bakgrunden som tonas ut i nästan vitt med en gradient. Självklart helt gjort med CSS.

background-color: #f1f3f5; /* Måla hela sajten i denna färg */
background-image: linear-gradient(
    to bottom, /* Skapa en gradient från toppen till botten */
    #c9ced7 0px, /* Första färgen är denna, rita den fram till nästa färg (totalt 1 pixel, för att ge en liten "kant"-effekt) */
    #adb5c2 1px, /* Nästa färg kommer redan efter 1 pixel, detta är starten på gradient */
    #f1f3f5 131px /* Gör en gradient mellan förra färgen och denna på en längd av 130 pixlar */
);

Detta är kopierat från guidernas egna WordPress-theme så att man ska känna igen sig. Alla logos känner ni kanske också igen stilen på, det är också samma stil som på guiderna. En tunn vit ram runt bilden, med skugga bakom. Flera logos vi inte hade från förut var tvungna att skapas, men det var en relativt enkel jobb eftersom vi har Photoshop-mallar för det mesta av våra nya sajter.

Grid

Alla logos läggs upp i rader, tre per rad på en dator med stor skärm, och en per rad på mobil. Detta mobilstöd är också helt nytt, en liten bonus. För responsiv design använder vi ett tunnt och enkelt CSS-ramverk som heter Simple Grid, det påminner om Bootstrap men är enbart för att skapa “rutnät” på mobil och PC. Stora fördelen är att det är en fil som bara är 1 kB stor, istället för nära 100 kB på Bootstrap.

<div class="row">
  <div class="col-6 col-12-sm">
    Full rad på mobil, halv rad på PC.
  </div>
</div>

Flexbox

Eftersom alla logos ser väldigt olika ut – jämför till exempel FF2 och FF12! – så måste vi se till att alla “rutor” de placeras i blir lika höga. Detta är något som tidigare var väldigt svårt med CSS, men fick till och med ibland gå tillbaka till att använda tabeller för det, något som är semantiskt inkorrekt. Men för några år sedan kom CSS Flexbox, och nu kan man använda det fullt ut.

Man har först en box som omslutar alla småboxar, denna huvudbox ges flex-stöd.

display: flex;

Och så när jag lägger detta på en <ol> lista så förstår webbläsaren att denna är i flex-läge och ska anpassa alla innehållande boxar efter varandra. Men vad händer när huvudboxen blir för stor för att alla boxar i den ska få plats? Då säger man bara att de ska puttas ner på nästa rad med denna:

flex-wrap: wrap;

Sen ska man lägga display: flex; också på varje innehållsbox. Då kommer alla boxar (alla <li> element) bli lika breda och höga oavsett storlek på skärmen eller innehållet. Superlätt! Inte en enda linje JavaScript behövs (som förut).

En sista fin detalj är att om man vill centrera alla logos horisontalt, men vertikalt placera dem på botten, så är det också sjukt lätt nu jämfört med förut. Dessa två linjer ordar det hela.

li {
  align-items: flex-end; /* Vertikalt */
  justify-content: center; /* Horisontalt */
}

Nu är allt placerat som det ska.

Grupper

För att förenkla för besökaren så delar vi in – precis som förut – alla spelen i tre olika grupper. Den numrerade originalserien av Final Fantasy (FF7, FF8, men inte FFX-2 t.ex.), alla andra FF-spel, och så resten av Square Enix-spelen (som ej hör till FF-serien, som till exempel Chrono Trigger).

Footer

Längst ner på sidan ligger några snabblänkar till FFUs olika större sajter, samt avslutande länkar med nyttig info, så som cookies. Alla dessa länkar använder sig nu av de nya “dev.” och “om.”-servrarna.

Historik

Som referens har du här en bild på den gamla designen (skulle gissa på 10 år gammal, och inte stöd för mobil). Den kan inte längre nås eftersom jag redan ändrat på alla länkar i TopNav, i footers, och andra ställen på FFU.

Två “nya” sajter på väg

Vi har två nya sajter under utveckling sedan en tid tillbaka, du surfar på en av dem – “dev.ffuniverse.nu”. 

Ordet ny är väl en överdrift för denna blogg är densamma som förut, bara på en annan adress. Det var inte långsiktigt logiskt att använda root-sajten på guide-servern som blogg. Det funkade i fyra år men inte längre.

Utvecklarsajten skapades därför, här på dev.ffuniverse.nu. Primärt ska detta vara vår blogg, vi fortsätter som förut med inblickar i våra planer och vår utveckling. Men på sikt kan vi här dela mer “bakom”-grejer, öppen källkod, med mera. Just nu ligger här bara de överflyttade blogginläggen från gamla servern i samma design som förut. 

Den andra sajten är dock helt ny. Den heter om.ffuniverse.nu och ska innehålla all information som gäller hela FFU. Till exempel information om hur man kontaktar oss eller hur vi använder cookies, eller vår historia (20 år!). Designen där är gjord av samma person som designat bloggen (ett fritt WordPress-tema). Den klär utmärkt en så enkel sida med fokus på bara text.

Vårstädning efter 20 år

Anledningen till denna omorganisering är vårt 20-årsjubileum och de stora strategiska grepp vi tar. Guide-servern ska fortsätta med sina högkvalitativa guider, och till slut ska alla våra guider ligga där. Då kan vi göra oss av med en mängd gammal och dålig och seg teknologi. På root, där bloggen låg förut, ska vi ha en enkel lista med alla logos till spelen så att man fort kan välja guide. Detta är mer logiskt än att ha det på www.ffuniverse.nu/games.aspx där det ligger nu lite för undangömt. Och svårt att komma ihåg. Denna ändring kommer inom nån månad.

“Om”-sajtens största syfte är att rensa nyhetssajten från information och sidor som inte är nyheter. Detta gör att vi redan nu kunnat radera en mängd gamla filer och text. Väldigt lite återstår för att denna sajt ska kunna utannonseras officiellt som färdig, bara uppdaterade länkar runt FFU.

Det faktiska målet

Parallellt med dessa småsajter pågår något mycket större och viktigare – det som händer med “om.” och “dev.” är bara små pusselbitar. Vi skalar bort del efter del av vår existerande nyhetssajt för att faktiskt kunna helt ta bort den och sätta upp en helt ny på en annan plats på FFU. Vi jobbar just nu för fullt med att migrera och snygga till alla tusentals gamla nyheter, för självklart ska de leva vidare.

När vi kommit lite längre i detta jobb så ska ni få ta del av en beta och mer info. När så nyhetssajten är flyttad kan vi konkludera med att all asp.net-teknik på servern är borta och det innebär avsevärt enklare underhåll av TopNav och annan infrastruktur på sajterna. Hela den gamla nyhetssajten ska då raderas och endast en introsida ska ta dess plats, där får man en översikt på hela FFU. 

Vi kommer också i denna stora process lägga ner FAQ-sajten. Den splittas upp och läggs in på varje respektive guide (ett arbete dom pågått en längre tid redan) medan sajt-info flyttas till “om.”-sajten.

Kvar av gammal teknik blir då bara communityn. Och den som hänger med oss in i nästa år får se vad vi kan tänkas hitta på då.