Teknisk webløsning

Jeg ar brukt mye tid på å gjøre research i fht teknisk webløsning for nettsiden min. For å finne riktig løsning har det vært viktig at jeg har hatt en klar og tydelig visjon for siden, både innhold- og designmessig.

Innhold og design
Innholdsmessig ønsker jeg at siden skal presentere meg og foretaket, hva vi kan tilby, presentere arbeider, vise kontaktinformasjon/skjema og en interaktiv blogg. Dette er altså ganske omfattende og variert innhold ved at jeg ønsker å kombinere både portfolio, forretning og en interaktiv del. Jeg ønsker også å kunne oppdatere siden hyppig ved å legge ut nye arbeider og skrive blogginnlegg.

Designmessig ønsker jeg en visuell og dynamisk side, som gjerne formidler identitet og originalitet via presentasjon av egne arbeider. Det er viktig at f.eks. bilder, film og øvrige arbeider presenteres på en hensiktiksmessig måte. Web er er svært visuelt medium, så god plass til bilder er viktig, og et godt samspill med tekst/informasjon. God navigasjon og brukervennlighet er også veldig viktig, designet må ikke komme i veien for brukeren. En god balanse mellom visuell presentasjon og tydelighet er altså viktig for meg.

Videre håper jeg å gi et personlig avtrykk på designet, ikke bare gjennom bildene, men også gjennom logo, fonter, komposisjon, farger og strukturer.

Hvilken webløsning?
Da kom altså det store spørsmålet; hvilken webløsning skulle jeg gå for for å lage denne nettsiden? Jeg kjenner mine begrensninger, spesielt teknisk, og har måttet brukt mye tid på tenke grundig på hva jeg kan klare i løpet av prosjektperioden. Det var godt å få klarhet i problemstillingen på Moodle fht hvilke prosesser vi bør prioritere under prosjekteksamen;

“Så lenge det ferdige produktet stemmer med hva du ønsker å kommunisere så spiller det liten rolle hvilken vei du har gått – via koding eller i kontrollpanelet – ferdig tema eller bygget selv fra bunnen. Det som er viktig dersom du velger et ferdig tema er at du får et eierskap til produktet. Jeg har sett hvordan man lett kan bli låst fast av et ferdig tema, både designmessig og teknisk. Tenk nøye gjennom hva du er ute etter før du begynner å lete, finner du et tema som er slik du ønsker så er det ingenting i veien for å bruke det”.
- veileder Irene Dyngeland

Her er så alternativene jeg har brukt over en uke på å drøfte;

1) Statisk hjemmeside;
Designe siden og undersidene i Photoshop, for så å kode siden i Dreamweaver. Trolig aktuelt å inkludere (for meg ukjente) systemer for bildepresentasjon og video, blogg og kontaktskjema; jQuery/javascript. Evt lage via CSS (med hjelp fra ulike tutorials, eks. http://www.cssplay.co.uk/).

Men i fht kontinuerlige oppdateringer vil denne løsningen trolig være litt tungvint? På andre siden ville jeg ha fått total kontroll på siden og designet, og lært mye om koding.

2) WordPress; (CMS)

a) Velge et eksisterende theme og skreddersy dette, enten direkte i Theme-editor og/eller ekstern editor (evt. via Child Theme)
b) Bygge et theme fra bunnen av (må kunne mye PHP)

Andre alternativer ville kanskje vært å bruke andre CMS-systemer;

“A content management system (CMS) is a computer system that allows publishing, editing, and modifying content as well as site maintenance from a central page. It provides a collection of procedures used to manage workflow in a collaborative environment. These procedures can be manual or computer-based” (wikipedia.com).

Det finnes mange slike, og hos denne siden var noen alternativer: http://cms-software-review.toptenreviews.com/

Valget
Når alt kom til alt, besluttet jeg å velge WordPress, siden dette både ble anbefalt på Moodle og jeg har vært borti det før (dog med varierende hell). Jeg synes f.eks ikke at Dreamweaver har fungert optimalt for redigering, da jeg fikk mange feilmeldinger og trøbbel med permissions og live view. Dette var kanskje også en av grunnene til at jeg grublet vel og lenge på alternativene.

Jeg landet likevel på å velge et eksisterende theme, på grunn av kompleksiteten til siden min- OG at jeg fant et helt perfekt theme for min side.

Å bygge en side fra skratsj ville nok ha blitt litt heftig. Jeg leste meg imidlertig opp kraftig på php, html og css fra mange ulike hold, så alle alternativene er grundig vudert.

Her er noen sider jeg har lest på  i fht webløsninger;

http://line25.com/tutorials/how-to-build-your-own-wordpress-theme

christinausa.blogg.no

http://www.lynda.com/Dreamweaver-tutorials/Dreamweaver-WordPress-Building-Sites/89308-2.html

http://bothack.wordpress.com/2006/09/17/how-to-create-a-wordpress-template-in-5-minutes/

http://www.estetica-design-forum.com/graphic-design-web-design-help/19130-can-you-combine-wordpress-into-dreamweaver-2.html

http://www.wpdesigner.me/2007/02/19/so-you-want-to-create-wordpress-themes-huh/

http://codex.wordpress.org/Editing_Files

http://codex.wordpress.org/Child_Themes

http://themeshaper.com/modify-wordpress-themes/

http://elevarbeid.webstudent.no/mmd_bergen/iren_dyngeland/

Jakten på det perfekte theme
Jeg jaktet altså lenge på gode WordPress-themes å ta utgangspunkt i. Så både på WordPress.org, ulike portfolioer, og generelt saumfarte internett i lang tid. Dette skulle trolig bli et av de viktigste valgene for siden og det videre arbeidet, derfor brukte jeg god tid på dette.

Her er noen sider jeg har sett på;

http://dittnettsted.com/nyheter/2011/08/10-wordpress-themes-for-deg-som-jobber-mye-med-bilder/

http://www.thephotoargus.com/freebies/14-superb-portfolio-and-photoblog-wordpress-themes-free/

http://themeforest.net/item/hi-creative-portfolio-wordpress-version/1587333?ref=designmodo/

Purity

Til slutt fant jeg altså et kjempefint theme som kan passe veldig bra til nettsiden min. Den har mange av både innhold- og designmessige rammene som jeg ønsker å bygge videre på. Siden heter “Purity”, og er designet av en “Tauris”. Den koster 35 dollar, og det tror jeg virkelig den er verdt.

Her er demo av “Purity”; http://rta.zxy.me/purity_wp/

“Purity is a Clean and Minimal WordPress Theme with a ‘BOLD’ feel that can be easily used as a personal portfolio or a business website”  (http://themeforest.net/item/purity-clean-minimal-bold-wordpress-theme/639774).

Mange fordeler med denne siden; enkelt og minimalistisk design, god navigasjon, gode redigeringsmuligheter, lagt opp til mye visuell informasjon (bilder/film). I tillegg er den godt organisert i forhold til mine behov, med faner og underkategorier, og plass til tekst. Den har også kontaktskjema, interaktive symboler og er kompatibel med svært mange browsere. Jeg ser også at designeren oppdaterer ofte og er veldig god på kundesupport.

Det eneste minusert jeg har funnet så langt er at den ikke er “responsive”, dvs. at automatisk tilpasser formatet til f.eks iPod og iPad. Men siden kan leses på dem, så dette argumentet veier ikke tungt nok i fht alle fordelene. De som uansett er interessert i den visuelle kvaliteten velger trolig en større skjerm.

Personlig preg
Jeg ønsker selvsagt å forme siden til min egen. Så det blir absolutt aktuelt å bruke CSS og PHP kunnskaper i forhold til dette. Jeg har blant annet lyst å teste anne bakgrunn, endre logo, teste fonter og generelt lage mitt eget unike uttrykk. Kanskje blir det aktuelt å lage et Child Theme. Notepad++ og Filezilla, samt ulike tutorials ligger klare! Jeg låner i utgangspunktet serverplass med broren min, har nettopp sendt mld om den er WP-kompatibel; PHP 5.2.4 or greater, My SQL 5.0 or greater, samt the mod_rewrite Apache module. Går det skeis må jeg finne annen plass.

Nå skal jeg bryne meg på installering av “Purity”. Krysser fingrene for at det går relativt smertefritt!

Logoprosess

Mitt enkeltpersonsforetak heter altså “Høivik Media og Design”, og vil tilby tjenester innenfor media; foto og film, samt design for trykk og web.

Jeg skisserte i første uka en god del analoge skisser, både monogrammer, symboler og wordmarks. Målet mitt var å skape en unik logo, men på grunn av foretakets art og krav til etternavn, landet jeg fort på alternativet med hele navnet; altså et Wordmark – som er ekstra tydelig for en liten bedrift. Minuset er at den kan bli litt anonym. Men dette synes jeg altså ble det beste alternativet.

Andre tanker bak designet var at jeg ønsket en tidløs, brukervennlig og original logo, dvs; tidløse fonter, farge og komposisjon, samt et design som har god lesbarhet både på trykk og web og i ulike størrelser. Med original mener jeg et uttrykk som speiler foretakets visjon og kommuniserer med målgruppen. Målgruppen kan være variert, men trolig noen som søker kreativitet og kvalitet. Dette er derfor ord som også ligger som et bakteppe i logoutviklingen.

Jeg startet den digitale prosessen med å gå videre med en logo hvor “Høivik” står størst, i sorte, sans serif versaler med relativt lett vekt. Fonten skisserte jeg først selv i illustrator, men fant en som heter Elegant Light (dafont.com) som lignet så mye at jeg brukte den i idefasen. Når det gjelder “Media og Design” testet jeg mange ulike løsninger, både versaler og minuskler. Jeg så ganske fort at jeg ønsket en mye tyngre vekt på disse ordene for å skape dynamikk.

 

 

Jeg prøvde både “og” og “&”, og testet mange ulike fonter. Jeg prøvde også ut sort på hvitt, og den negative på sort og grå, samt la til farger i en annen versjon. Jeg testet også ulike komposisjoner, og testet figurative varianter. Så mange muligheter og valg!

 

 

Jeg hadde mine favoritter, men så meg litt blind, derfor var jeg glad da 5 familiemedlemmer fikk komme med tilbakemeldinger da jeg var hjemme på helgebesøk. De fikk alle en solid brief om foretaket; visjon og forretningside. Jeg sa imidlertid lite om mine favoritter, så det formet ikke deres valg.

Resultatet var veldig interessant, da de 5 ulike personer hadde helt ulike favoritter;

• En mente at en så ren og klassisk logo (uten farger), kanskje ville fungere best med tanke på varighet og bruksområde. Vedkommende ville gjerne bytte ut &-tegnet til ny font, og kanskje gjøre “Høivik” enda større i fht undertitlene (bedre dynamikk).
• En annen mente at den logoen som formidlet foretaket best var en med farge – mer fokus på kreativitet og fresh fremtoning via fargekontraster.
• To mente at forskjell på fontene hos de ulike ordene var en fin effekt, gjerne la “Design” skille seg fra “Media” da de to ordene omfatter ulike områder. De mente også at et annet &-tegn ville se bedre ut.
• Sistemann oppfordret meg til å prøve å plassere “Media &/og Design” under hele “Høivik” – altså at hovedtittelen er like brei som de to undertitlene.

Med andre ord, mange gode og nyttige inspill – men gjør at jeg har igjen en del av logoarbeidet. Noen aspekter har jeg imidlertid klare;

• Jeg vil ha en logo i sort/hvit og negativ
• Jeg vil ha en logo som synes godt i ulike skaleringer
• Jeg vurderer å ha en logo i farger på hjemmesiden, kanskje også med mer effekter og strukturer – tilpasset web og budskapet til nettsiden. Logoen må imidlertid være svært lik den “ordinære” slik at det ikke hersker noen tvil om at den representerer samme foretak

Denne uken vil jeg derfor prøve å fullføre skisseringen av logo. Jeg vil ta utgangspunkt i mine favoritter og ha tilbakemeldingene i bakhodet. Prosessen og skissene vil jeg så skildre i rapporten, og den siste delen av logoprosessen håper jeg å publisere i løpet av uka.

Tar forresten gjerne imot mer synsing utenifra!

Oppdatering og fremdrift

Håper alle har hatt ei flott 17. mai -helg!

Tilbake til hverdag og prosjekteksamen. Jeg har hatt en ganske deltaljert og omstendelig fremdriftsplan i dette prosjektet, men ikke uventet har det allerede blitt noen endringer.

Den første uka gikk etter “malen”; etablering enkeltpersonforetak, utforming foretaksnavn og oppstart logoarbeid.

I forrige uke sto ferdigstillelse av logoen, rapportskriving og valg av webløsning for nettsida mi på planen. På grunn av 17. mai og en tur hjem til familære “logo-konsulenter”, ble uka litt annerledes. Rapportskrivinga har blitt utsatt pga mye logo-refleksjon og research i fht webløsning.

Denne uka står det oppført at jeg skal begynne med skissering av innhold til nettsida, teste fonter, lage wireframe, se på designelementer og foto. Evt lage ferdig hovedside. Nå har det seg slik at den webløsningen jeg lander på skiller seg noe fra fremdriftsplanen, derfor vil innholdet i de kommende ukene endre seg en del.

Jeg har valgt å ta utgangspunkt i et ferdig WordPress theme som jeg skal skreddersy videre, og ikke bygge opp en side fra skratsj. Denne uka og neste uke vil derfor dreie seg om å ferdigstille den endelige logoen (web-versjonen som skal på nettsida), samt installere Wordpress-theme, og tilpassing av denne.

Nærmere bestemt blir det installasjon og organiseringen av innhold denne uka, og  selve innholdet (bilder, film, blogg, tekst) samt endringer i designet neste uke. Dette er i grove trekk, mulig det kommer til å skli litt over i hverandre. Skal også prøve å dokumentere mye i rapporten, slik at ikke alt faller på siste uka.

Mer om logoprosess og webløsning i kommende innlegg.

Ukerapport WEBP

Da er den første uka med Prosjekteksamen Web over. Eller, det er i alle fall fredag

Tenkte å kjapt oppsummere hva jeg har gjort så langt denne uka.

Mandag satte jeg meg inn i hvordan jeg skulle søke enkeltmannsforetak. Jeg besøkte blant annet Altinn.no, Brønnøysundregistrene og noen andre sider med tips om prosessen. På Altinn hadde de mange skjema og “oppskrifter” som var gode å ha.

Før jeg sendte inn søknaden, eller Samordna Registermelding, måtte jeg gjøre ekstra planlegging. God planlegging og en gjennomtenkt ide er alfa omega for en bedrift, uansett størrelse. Jeg gikk derfor ekstra nøye gjennom forretningside/forretningsplan (de punktene som er relevante for meg) og drodlet firmanavn. Dette gikk tirsdag og noe av onsdag med på, før jeg sendte inn søknaden onsdag ettermiddag. Den utfylte forretningsplanen vil jeg legge ved prosjektrapporten.

Endelig navn på foretaket ble Høivik Media og Design. Nøytralt, men beskrivende? Etternavnet måtte med siden det er et enkeltmannsforetak, og videre syntes jeg at både media og design måtte med for at det skulle skildre omfanget. Hadde det vært snakk om en større bedrift eller organisasjonsform, ville det kanskje vært naturlig å finne på et helt nytt og unikt navn/konsept.

I går, torsdag, fikk jeg tilbakemelding på at foretaket og alle papirer var godtkjent.

Det gikk fort! Litt stolt, litt spent, men egentlig ganske så nødvendig nå som noen oppdrag har begynt å melde seg. Torsdag og fredag har nå gått til å lese pensum om logo (“Logo Design Workbook”, gjøre research på nett, lese fargeteori, mm. Jeg har også kommet godt i gang med analog skissering av logo/firmanavn. Neste uke tar jeg fatt på digitalt arbeid med logoskissene.

En utfordring i logoprosessen er hvordan et såpass langt navn skal presenteres på en god måte. Jeg har skissert både wordmarks, symboler og monogrammer. Ser for meg å kanskje måtte ha både hele navnet og monogrammer til disp, til ulikt bruk.. Får pønske mer på dette når jeg begynner digitalt!

Litt artig at jeg plutselig fikk to oppdrag samtidig under denne prosjekteksamensperioden. Det blir mye å gjøre, men samtidig motiverer det meg virkelig til å få på plass organisasjonsnummer og nettside for foretaket. Det ene oppdrager er å lage design til et bokomslag, mens det andre er å ta bilder og lage plakat til nok en masterkonsert på Musikkonservatoriet.

Spennende tider! Og lille jenta i magen sparker og holder på, så det ser ut som det blir en aktiv mai på oss begge

God helg!

Web Prosjekteksamen – Uke 1

Da har tiden kommet for å sette i gang Web Prosjekteksamen, WEBP. Dette står på agendaen frem til innleveringsfristen fredag 8. juni.

Tenkte å beskrive prosjektbeskrivelse og fremdriftsplan i korte trekk her på bloggen.

Prosjektbeskrivelse

I forbindelse med Prosjekteksamen Web ønsker jeg å utvikle et webprodukt i forbindelse med oppstart av egen bedrift – et enkeltforetak som skal tilby enkle tjenester innenfor design og media;

- design for trykk og web
- tjenester innenfor film og foto

Begrunnelse

En stor motivasjon for å studere MMD var å tilegne meg ferdigheter til å både opprette et enkeltmannsforetak, i tillegg til webkunnskaper som kunne gjøre det mulig å profilere seg via internett. På grunn av studieårets avslutning, føles det naturlig å bruke den siste prosjektperioden på en slik oppgave.

Dette medfører at jeg ikke legger opp til kundekontakt i produksjonsprosessen, men er på en måte min egen kunde. Jeg opplever likevel at problemstillingen vil være passe omfattende og relevant i forhold til pensum og de faglige utviklingsmålene. Mitt overordnede mål med eksamen blir til syvende og sist å generere fremtidige muligheter for kundekontakt.

Problemstilling

I forbindelse med prosjekteksamen ønsker jeg å lage følgende produkter;

a) Utarbeide logo til foretak/bedrift (inkl. navneprosess og kort forretningsidé)

b) Designe og utvikle nettside for bedrift
(med undersider;
- Hovedside
- Om meg/foretaket/bedriften
- Tjenester – hva jeg vil tilby
- Portfolio/link til arbeider
- Kontaktinformasjon; e-post, telefon, evt. kontakt-skjema)

Fremdriftsplan 

Uke 1 – Utvikle forretningside, kommunikasjonsmodell og firmanavn, oppstart logoarbeid

Uke 2 – Logoproduksjon ferdigstilles, oppstart ide/research nettside, valg av plattform

Uke 3 – Produksjon nettside – innholdt, wireframe, grafiske elementer

Uke 4 – Produksjon nettside – koding og teknisk arbeid

Uke 5 – Deadline nettside, utvikle og ferdigstille cd-cover og rapport, INNLEVERING WEBP

Rapportskriving skal foregå parallelt med det andre arbeidet gjennom hele perioden.

Denne uka, uke 1

Denne uka skal jeg altså se på forretningside – sette meg inn i markeds- og kommunikasjonsteori, se på enkeltmannsforetak-papirer, og drodle firmanavn. Blir veldig gøy og litt rart å virkelig skulle begynne denne prosessen. Gleder meg også til å se på logo! Frem med Logo-boka igjen

Håper å få fullført uka etter planen og komme med en ukesrapport på fredag. Ønsker alle ei fin mai-uke!

Webmappa straks levert

Da er nettsiden til webmappa endelig ferdig – kun litt rapportgreier igjen!

En av de største utfordringene i dette prosjektet.. ja det ble ganske mange forskjellige utfordringer. Flash eller Html? Server som ikke ville samarbeide, permissiontrøbbel, store ambisjoner og lite kunnskap. OG omgangssyke.. Hehe.

Men den største utfordringa har nok likevel vært selve organiseringen. Med så mange oppgaver og sider i ulike formater som skulle scriptes og linkes sammen, lastes opp, linkes på nytt til/fra bloggen, osv.. Men med tunga rett i munnen, håper og tror jeg at løsningen fungerer ganske greit.

Klikk på bildet for å komme til nettsiden min!

Jeg har designet en nettside i Flash (mot anbefalingene), noe som gikk veldig greit. Jeg hadde kommet så godt i gang da det ble “mot-anbefalt”, at jeg bare kjørte på. Har fått diskutert temaet en god del på forum, og selv om Flash-sider tenderer i å forsvinne til fordel for HTML5 og gjengen, tenker jeg at det må være greit å kunne litt også. I forhold til fremtidig portefølje, har jeg en plan hvor jeg smetter denne mappa i en underkategori kalt “Flash”. Har jo noen sider etter hvert som er bygget opp via html og css også!

(PS; søker man litt på nettet finner man flere app’er og browsere for iPod/iPad som støtter Flash).

Men ja, altså, denne Flash-sida har da samlet alle Obligene på fremsida, via ikoner. De har alle direktelink til oppgavene. Har ikke skrevet så mye om de respektive prosessene her på bloggen, disse har havnet rett i rapportene.

Den siste linken; “Reflektert Dagbok” går videre til en ny side/scene, hvor jeg har linket til utvalgte arbeider – og selve bloggen. Siden refleksjonsevne var en viktig del av vurderingskriteriet, har jeg valgt å linke til blogginnlegg – som BÅDE reflekterer over aktiviteten OG har link til resultatene.

Alt i alt fornøyd med mappa, spesielt forholdene tatt i betraktning. Har vært skikkelig fersk på ALT som har dreid seg om web dette semesteret, og hengt over spybøtta i 3 av 4 mnd. Men nå er den altså ferdig! Nesten.. skal evt. forbedre Oblig 06 litt, og justere de siste detaljene på rapportene i mårra. Så levers det og vi tar helg før neste prosjektperiode!

Status Update

Tenkte å komme med en liten oppdatering sånn i innspurten av WEBM.

De siste ukene har jeg jobbet med å forbedre Oblig 06 – Oblig 08 og læringsaktiviteter, endre og sammenføye rapporter, samt designe en nettside som skal samle disse arbeidene.

Nå er jeg snart i mål, men serverområdet mitt streiket dessverre etter WordPress-oppgaven. Dette har medført at jeg ikke har fått integrert linker eller action script i arbeidene mine, og satt noen kjepper i hjulene. Men jeg får låne serverplass med broren min, så fra og med i morgen blir det storstilt serverkommunikasjon! Dette er også årsaken til at alle linker koblet opp server her på bloggen er defekte for tiden.

I tillegg fikk jeg omgangssyka i dag, ganske så typisk! Men desto deiligere skal det bli å levere og ta helg.

Lykke til, alle medstudenter