Feedback på portfolio

Tråden skapades och har fått 75 svar. Det senaste inlägget skrevs .

Jag ska börja söka praktik hos olika designbyråer i Stockholm snart så jag har gjort iordning min portfolio-sida. Jag har inte gjort den helt färdig ännu men på det stora hela. << home : klaranilsson.com >>

Jag skulle vilja veta lite vad första intrycket är, vad ni känner att den kommunicerar och hur det känns att navigera.. Jag har pluggat utomlands i omgångar och de flesta projekt har jag gjort på engelska, tänkte därför lägga upp mitt cv även på engelska..någon som har tankar kring sådant? Borde jag göra en svensk version också?

Tekniskt;
Jag kämpar fortfarande med att menyerna ska komma framför bild-spelen och att det ska gå att använda bildspelen fast menyer är är nere (utan att vara i vägen).. om någon kan peka mig i en riktning kring sådant är det också självklart välkommet.

Work in progress.. det vore till stor hjälp med lite feedback!

/Klara

Eftersom jag inte är designer så vill jag inte kommentera de aspekterna, men däremot har jag varit med om väldigt mycket rekrytering, och också omvänt arbetat som "coach" för jobb- och praktiksökande och utifrån det perspektivet skulle jag absolut säga att du ska göra det här på svenska. Engelska om du har lust, men det är mindre intressant, men svenska nödvändigt.

Personligen skulle jag slänga en ansökan gjord på engelska rakt i sopkorgen, eftersom det för mig signalerar att avsändaren inte förstått att anpassa kommunikationen till mottagaren, vilket är grunden.

Jag skulle också lägga upp lite mer personligt material, gärna också foton på dig (lösenordsskydda om du inte vill lägga upp bilder för kreti och pleti). Det är lätt att tro att man kommer att bedömas enbart utifrån ens arbetsprover, men på en arbetsplats så bryr man sig om vem man får som kollega och att få ett ansikte gör mer än man tror

Jag gilla signaturen som logga och färgen är helt OK. Däremot undrar jag om att använda kursiv stil i menyrubrikerna. Rosa och kursivt ger ett lite "tunt" intryck (nej, det är fel beskrivning - men det blir lite förminskning) undrar om du inte skulle vinna på att ändra till normal stil

CV - Använd omvänd tidsordning - dvs det senaste först. Det är mer intressant att se Design Academy än Åsö gymnasium

Döp om About this site till About me och flytta upp den. Där finns ju ett personligt meddelande från dig och foto - och det är inte en beskrivning av webbplatsen

Jag tappar en del av menyinnehållet under Design/Concepts på sidorna: Objects, Omnivore,
(Firefox 3.6)

Det stämmer nog med engelska/svenska. Kanske två versioner?

Annars tycker jag att webbplatsen är snygg och den känns inte som en dussinsida. Speciellt föredömligt att det inte ser ut som en blogg

Åh wow! Tack för responsen! Maken på konstruktiv kritik!

Ska genast ändra på sakerna som CV't och fonten, håller med om det! Eventuellt köra på att göra en liknande logo i svart, vilket kan göra det hela mer till en helhet.

Att göra den på svenska hade jag nog på känn och det är definitivt något jag ska göra, även om man inte gör det på en pisskvart Angående CV, bör man lägga till mer man är bra på, typ vilka program man kan eller tekniker? Bävar lite för det eftersom min utbildning inte har riktigt satsat på sådant och inte jag heller så det kan kanske se lite fattigt ut?

Richard; med personligt material, menar du att texten jag skrivit är lite för allmänn egentligen och inte säger så mycket om mig, rätta mig om jag missuppfattat?

Menyn som tappas bort kan jag kanske få lite hjälp med av en kompis ikväll för mina kunskaper i det räcker nog inte..

Tack så väldigt mycket för responsen, tar till mig varenda ord och blir peppad på att gå vidare!

/Klara

  • Medlem
  • Stockholm
  • 2010-03-24 21:06

Klarabara, det var fan dom snyggaste grejerna jag sett på länge i en portfolio - men är det inte industridesignbyråer du ska kika på?

Det är inte så mycket grafiskt, mer prylar liksom?

Tack Tangen! Det värmer!
Jag har ju inte specificerat riktigt vad det är för slags byråer jag ska söka mig till ännu, håller det lite öppet fortfarande. Min utbildning var ganska bred men mest har jag ju gjort produkter, väldigt analogt men ändock.. Det som är knepigt med en portfolio är ju urvalet och vart man säger stopp..

  • Medlem
  • International user
  • 2010-03-25 13:28

Kan inte kommentera på innehållet men sidan ser bra ut! En sak, det känns som typsnittet i menyerna (och möjligtvis resten) bryter. Tror delvis att det är för att det är kursivt i menyn, men det kanske kan vara värt att testa ett annat typsnitt? Hade kanske tänkt om vad gäller linjerna under också.

Vad tror du om de här? Den första är 14pt Georgia, den andra 14pt Helvetica Bold.

Underligt, jag bytte till Verdana igår undrar hur det kommer sig att det inte syns..men helvetica ser bra ut! En del projekt uppe har jag (för att kunna styra bättre över hur text och bild ser ut tillsammans) lagt upp som bilder med text i. Där har jag använt mig av Verdana så därför gick jag över till det på menyn.. Jag ska ta mig en funderare på om helvetica är bättre..tog bort det kursiva dock, det kan bli lite mycket lut med loggan..

Linjerna under tänkte jag använda mig av till under-menyn för nu är de lite flytande utan att egentligt början eller slut..

Har fixat till menyn som försvann i alla fall och påbörjat översättningen till svenska..

  • Medlem
  • Göteborg
  • 2010-03-25 16:51

Tyvärr får jag lite dåliga vibbar av Verdana. Det är bara lite lika med "Tråååkigt!" Att Ikea har lagt beslag på typsnittet för att prångla ut sitt standardiserade sortiment över hela jordklotet gör inte det bättre.

Undermenyn är enkel och stabil i Safari, men beter sig lite konstigt i Firefox/Camino/Opera: meny-elementerna fladdrar och hoppar på varandra när man sveper över med musen. jQuery versionen är bra nyare än expandingMenu-funktionen. Det kanske behövs en liten uppdatering någonstans.

Om man tittar under huven, är det några fler egendomligheter, bl. a. en <strong>-tag i <head>.

Annars är sidan klart trevligt att bläddra igenom. Det känns personligt samtidigt som du visar teknisk mångsidighet. Det kan inte vara en nackdel, oberoende om vart du vänder dig.

Lycka till!

  • Medlem
  • Göteborg
  • 2010-03-25 17:13

Du har oxå ett antal "display:block" utan semikolon efter i din css. Det kan bli en massa feltolkningar av efterföljande rader och eventuellt en förklaring till menyns underliga beteende.

Ett bra tips är att validera sin html och css:

http://validator.w3.org/

http://jigsaw.w3.org/css-validator/

Har man det rätt, så slipper man ofta en hel del huvudbry när det gäller "underligheter".

Jag skulle nu göra en /se och en /en och det blev rätt knasigt så jag har börjat om igen ifall någon undrar vart sidan har tagit vägen.. något om databas-namn o grejer...

mycket som inte verkade vara rätt med den gamla ändå så det blir nog bättre såhär.. hoppas jag.....

Nu har jag börjat bygga om allt på nytt från grunden igen.. Jag lämnade på er inrådan Verdana för Helvetica.. Nu kanske det här är fel ställe att fråga, men jag har stora problem med att få det hela att vara i jämn kvalité? Jag har gjort bilder i PS med mina arbeten och texten för att kunna styra mer över layouten och till vilken bild man ser vilken text. Det problem jag får är att texten som "blöder", "e" ser kladdigt ut. Vidare har vissa bilder fetare look än de andra även om jag skapat dem med samma inställningar..vad kan det vara som går snett?

  • Medlem
  • International user
  • 2010-03-28 19:21

Photoshop gör konstiga saker när den kantutjämnar text oavsett vilken metod man väljer (Crisp etc). Själv gillar jag inte det alls eftersom man aldrig kan få det att se ut som det gör i en webläsare eller utskrivet. Tänk dessutom på att varje OS har en egen metod för att utjämna typsnitten, så bara för att du får det att se okej ut i OS X så betyder det inte att det ser bra ut i Windows.

Min rekommendation är att försöka jobba om layouten lite så att du kan lägga in texten via html och css istället. Det blir smidigare i längden än att behöva gå in och modifiera varje bild och typsnitten är likadana igenom hela sidan i olika webläsare.

Jag har lagt upp sidan på nytt nu, på svenska. Helvetica (även om jag kanske borde ha sett filmen först ) och separerat dem från bilderna osv. Jobbar fortfarande på en text om mig själv.

Dock har jag stött på problem med CSS.. jag satte dit semi-kolon som saknats och nu beter sig safari på samma vis. Jag har en känsla av att det är något annat som får det att hoppa, position eller storlek, jag vet inte alls vart jag ska börja. Någon som kan peka mig i en riktning?

edit: dessutom har jag fått en fin scrollbar längst ner...va***

  • Medlem
  • Göteborg
  • 2010-03-30 20:43

Några fler css-fel:

rad 106: font-size : 1,5em; (komma isf punkt)
rad 145: margin-right: 0.5em (ingen semikolon)
rad 166. position : fixed; !important; (ta bort semikolon före !important)
rad 238: font-style : bold; (det finns inte, antigen är det font-weight som syftas eller så skall det vara normal, italic eller oblique)

Har du möjlighet att få bort (den tomma) strong-taggen från sidans head, så slipper vi en skog av irrelevanta felmeddelanden som uppstår på grund av den.

tittar vidare...

  • Medlem
  • Göteborg
  • 2010-03-30 20:54

Om den fina scrollbaren i botten:
du har en div med id "copy" som har en width 100% OCH en definierad padding. Enligt standard för css-boxmodellen, ingår varken margin eller padding i witdh. Hur stor fönster man än har så blir den diven lite bredare än fönstret och därför en scrollbar.

Lösningen: Ta bort antingen width- eller padding-deklarationen.

Senast redigerat 2010-03-30 21:38
  • Medlem
  • Göteborg
  • 2010-03-30 21:04

för din body har du valt typsnitt som följande:
font-family: Helvetica, sans-serif, Verdana;

Deklarationen sans-serif skall ligga sist och används ifall inga namngivna typsnitt finns tillgängliga.
Tyvärr kan man inte anta att alla har Helvetica (läs: om man kör Windows), därför är det bar med ett vettigt andrahandsval. Jag skulle föreslå Arial isf verdana då den är mer lik Helvetica än Verdana.

De flesta som kör OSX har även Helvetica Neue på sitt system som är, i mitt tycke, en smula roligare än Helvetica.

Mitt förslag, summerat:

font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;

  • Medlem
  • Göteborg
  • 2010-03-30 21:35

Om css och den hoppiga menyn:

padding i #menu ul a:link, visited och active är 3px 10px;
padding i #menu ul a:hover är 0 0 0 0px; (är det nollor kan man skriva bara en, och är det noll behövs ingen enhet)

=> paddingen ändras när man kommer över med pekaren och menun hoppar.

Faktum är att du ändrar ingenting förutom detta ovan i alla fyra #menu ul a:link, :visited, :active och :hover. Du skulle kunna ersätta alla fyra med en:

#menu ul a {
display:block;
position : static;
padding:3px 10px;
background-color: #fff; (om man anger det som bara background: skall man ange värden för background-color, background-image, background-position och background-repeat på samma rad)
margin:0 0 0 0.5em; (du hade två margin-deklarationer, detta är summan av dessa)
text-decoration : none;
color : #333;
}
Vill du verkligen att det skall hoppa till när man sveper över så lägger du till en deklaration för #menu ul a:hover med (och endast med) den förändrade paddingen.

Wow, det känns mycket bättre nu. Gör mitt allra bästa för att förstå det här med marginaler och padding.. det som jag fortfarande brottas med är den röda streckade linjen som dyker upp i firebug, är den nödvändig? Sen det faktum att när man klickar på en meny och undermenyn åker ner så åker den också till sidan, jag begriper inte vart jag kan ändra på det?

Tack så oerhört mycket för all hjälp jag redan fått!

  • Medlem
  • Göteborg
  • 2010-03-30 22:30

Jag vet inte vad du menar med "den röda streckade linjen som dyker upp i firebug". Den ser inte jag.

Du har kvar ett html-fel (som kan ställa till): referensfoten till indexhibit ligger utanför body-tagen.

När det gäller menyförflyttningar: det är "minnet som aldrig..." som är bredare än "Design / Koncept". När undermenyn blir synlig via javascriptet så behövs det mer plats från höger för att den listan skall få plats. Det verkar vara lite lurigt att tackla i det här fallet. Min fullösning är att lägga till ett gäng med blank (sk "non breaking space":   ) före "Design / Koncept", innom li-taggen för att få den lika bred som "minnet som aldrig...". Kanske någon annan kan se den enkla, snygga lösningen jag inte kan se just nu...

Jag misstänkte nästan att det var något med det namnet som gjorde det..
Det "jobbiga" med det här är att jag inte skapar någon html själv, den genereras bara av php o java etc.. jag har nu börjat fatta lite mer av CSS-filen nu men jag har verkligen inte en aning om vart jag ska lägga in blanka steg i den, kan man göra det? Fattade inte alls först var den där strong-taggen låg, men den var i en php-fil. Så jag har lärt mig mycket nytt ikväll!

Kan man inte få menyn att ligga ovanpå wrappen?

  • Medlem
  • Göteborg
  • 2010-03-31 20:21
Ursprungligen av klarabara:

Kan man inte få menyn att ligga ovanpå wrappen?

Vad menar du?

  • Medlem
  • Göteborg
  • 2010-03-31 19:42

Det verkar som javascriptet i expandingMenus.js kan vara en del av förklaringen till det hoppande beteendet, främst i Safari. Om man använder jQuerys slideDown/slideUp isf show/hide så tvingar man en vertikal rörelse, och menyn beter sig mycket bättre.

Före:

/* hide items if not active */
	if (items.is(".active") == true) {
		items.hide();
	}

	/* hide items if not active */
	if (items.is(".active") == false) {
		items.hide();
	}
	
	/* add click functions + pointer to title */
	item_title.css({cursor:"pointer"}).toggle(
		function () {
			items.show(speed);
		}, function () {
			items.hide(speed);
		}
	)

efter:

/* initialize by hiding sub-menu items */
	items.hide();
	
	/* add click functions + pointer to title */
	item_title.css({cursor:"pointer"}).toggle(
		function () {
			items.slideDown(speed);
		}, function () {
			items.slideUp(speed);
		}
	)

jag har i samma väva rationaliserat lite de båda villkorade if-satser som tillsammans tar ut varandra.

  • Medlem
  • Göteborg
  • 2010-03-31 20:07

I överlag är din layout väldig minimalistisk. Det kan man inte säga om din css-fil som innehåller en massa bröte och upprepningar. Det blir ganska svårt att reda ut vad som påverkar var. Mitt förslag är att börja om "från början".

jag startade från en blank css och plockade över bit för bit från den befintliga css det som behövdes för att få ihop en vettig framsida. Det blev så här:

http://dl.dropbox.com/u/3714220/style.css

Det räcker att man anger typsnitt EN gång för body-tagen, sen gäller den för alla andra underliggande element (om man inte vill på annat sätt, förstås).

stilmallen börjar med att nottställa alla marginaler och paddings, så det skall man inte behöva göra om i enskilda elementstilar.

Ha en grundstruktur: Börja med att definiera allmänna stilar som gäller på html-elementnivå (body, h1, p, a...), om det behövs. Sedan kan man lista de stilar som bygger upp sidans layout (wrapper, menu mm). Sist får man lägga in de specialfall som kanske bara gäller på någon sida eller så.

Ja det vet jag knappt längre själv.. eftersom jag inte vet hur jag ska lägga in tomma tecken i menyn så undrar jag om det finns nåt annat man kan göra för att göra "övermenyn" (section-titles) större eller tillåta den att flyta ut till höger?

Java-scriptet är ju helt lovely! Wow!
CSS-layouten hade tillbaka det där hoppet i hover men jag ser inte vart i koden det finns..

  • Medlem
  • Göteborg
  • 2010-04-01 17:56
Ursprungligen av klarabara:

eftersom jag inte vet hur jag ska lägga in tomma tecken i menyn

Där i cms-en (Indexhibit) du har matat in
"Design / Koncept"
skall du mata in
"Design / Koncept     "
Inte den snyggaste lösningen precis, men det lilla vänsterhoppet förvinner.

Ursprungligen av klarabara:

Java-scriptet är ju helt lovely! Wow!

Ja, du har ju jQuery med, så det är bara att utnyttja. Sorgligt nog används den inte riktigt på "rätt" sätt här. Egentligen skall man inte behöva ha en massa onclick="do_click();" i sin html. Det hade räckt med en extra rad i javascript-filen för att automagisk haka på funktionen på de aktuella li-element.

Men allt sånt som genereras av ditt cms är väl en nivå svårare att påverka, antar jag.

Ursprungligen av klarabara:

CSS-layouten hade tillbaka det där hoppet i hover men jag ser inte vart i koden det finns..

Det är i:

#menu ul a:hover {
	padding-left: 2px;
}

Padding för a i normalt fall är den som anges i default selektorn * , dvs 0.
Vill du ha bort hoppet och få lugnet tillbaks i menyn, är det bara att ta bort hela stycket ovan.

Underbart! Nästan färdig med den svenska versionen!

Sådär.. jag har nu lagt till en horisontellt gående undermeny istället, i samma stil som på min pappas sida.. Bytt runt ordningen på menyerna, design först (jag var lite osäker på det förut) och teckning/måleri blev Teckning/Annat. Tänkte att det skulle rymma fotografi och eh.. nåt mer kanske.

Har skrivit en ny text om mig själv och lagt till en Just Nu sida..

Lite fundersam på huruvida bilderna kommer fram? Jag har använt mig av thickbox-versionen nu med mindre thumbnails. Tänkte att om de är små så ser man inte så väl så man förväntar sig att de går att klicka på istället och då ser man dem i stort.. å andra sidan så ger de ett lite tomt uttryck.. Under An essence of.. har jag ett annat format, hur känns det i jämförelse mot Hittarp-projektet?

Ständig uppdatering..

  • Medlem
  • Göteborg
  • 2010-04-05 23:59
Ursprungligen av klarabara:

Lite fundersam på huruvida bilderna kommer fram? Jag har använt mig av thickbox-versionen nu med mindre thumbnails. Tänkte att om de är små så ser man inte så väl så man förväntar sig att de går att klicka på istället och då ser man dem i stort.. å andra sidan så ger de ett lite tomt uttryck.. Under An essence of.. har jag ett annat format, hur känns det i jämförelse mot Hittarp-projektet?

Jag föredrar thickbox-formen. De underliggande bilderna i An essence of.. får inte ens plats på min 13" MBP-skärm. Och så måste man skrolla ner igen för varje bild. Däremot, när det gäller thickboxen, i och med att overlayen är vit (som sidan) och så gott som ogenomskinlig, så tappar man lätt kontaktkänslan med sidan under. Tills den första bilden laddar, undrar man lite om något har gått snett.
Mina två ören: kör med thickbox fast med lite mer genomskinlighet i overlayen och ev lägga till en lätt ton till den.

Aah.. good point! En god natts sömn var det..

Bevaka tråden