Long time postponed I now have build my website from ground up to showcase my magazine designs. Inspired by the great site from #Lee I thought I should put more »show« in the »case«. I started the design process with the big desktop monitor in mind. As always working with Sparkle was a real pleasure. It is really joyous that I can shove around my typographic elements to my hearts content. But then comes the hard part: tweaking for all devices. Nearly each and every item has to be manipulated separat. I would be very happy if in the next version this task would be less slavishly. That’s why I saved myself the effort to accomplish a mobile version because I think nobody can perceive nor judge graphic design in the size of stamps on tiny screens. So here is my new site: [http://www.sfbdesign.de] I hope you will enjoy it.
Update: Now I found the time to put together a mobile version of my site. I decided to work with a separat file to prevent inadvertently messing things up. Thanks @macarna I was able to use a script that redirects the user to the appropriate version. The content for mobile is somewhat stripped down but sufficient enough to give a first impression of my work.
Good job!
Yes, making the mobile version can be boring. I follow a path like this; After setting up 1 page for both desktop and mobile, I continue by duplicating that page. This is easier.
Thank you for your nice comment!
For another site I went this way with two separat renditions, one for desktop one for mobile. The mobile version is located in a folder named »mobile«. The mobile user lands on the desktop version with a link to click on. Then he is redirected to the mobile version. But this is only the poor man’s solution. I’m sure there is a simple line of script to put somewhere that detects the mobile device. But because I have no knowledge regarding code I only have the aformentioned way to go at this time.
That’s a great site, very solid & professional made.
Yes about tweaking for all Devices, that’s also a chapter I had to learn … and still learning. So, there’s a sentence in web design that say “mobile first” and if you take this serious … start from the mobile view … always. It’s easier to upscale the things, then to downscale. Then as @macarna mentioned. Make an template, edit it for all the Devices, then copy it.
Some critic: So, like it’s always with animated Effects. These are Effekts, these are Effects these are Effects … and it’s really annoying.
So, for the first time that’s absolutely ok, BUT if I want to explore your Site I skip this after three sites … I don’t want to wait until always the same sequence of effects will be played … really leave this or reduce it to a minimum.
I had a long conversation some days ago with a friend and really good designer exactly about this, because I had also some Effects on my site. He just asked me “… for what reason? does it have a function?” … I had to answer with “no” and removed them … damit war das Thema durch … Grüsse
I see this also on some other websites, where you can choose, that you want to move to the mobile Version. I don’t see a problem there.
But on your Site I can’t find a button to move to the mobile site, should this be working right now or it’s in the planning?
Thank you very much for your comments.
I know the sentence of »mobile first«. There are aims and goals where this makes absolutely sense. But as a graphic designer I’m used to think »desktop first« because this my natural habitat. Regardless of that I should definitely show a little more than the meager first screen. And I will do (but with no set timeframe). Actually with the animations I wanted to make sure that all elements appear in particular order. Maybe sind mir da die Gäule durchgegangen and I should make the animations less noticeable. On the about and contact page they are indeed rather useless. The downside is that I now have to touch every single element again (sigh!). It would be less time consuming if we could change parameters for multiple selects. Grüße zurück…
I really like your website. The layout, the huge fonts, the choice of colours.
The animations … I felt they were okay, because I realised what you wanted to achieve … everything should appear in a particular order. Nothing wrong with that.
Maybe if you experiment with the animations, make them slower, or appear softer, they will be less noticeable and maybe they will become more harmonious?
I agree, too many animations on a page can be overkill and become very annoying for the website visitor. But if you use them sparingly and well-placed, they can be quite effective and enhance a website.
Hello @Shadowfax, thank you for your nice comment. I’m happy that you love my huge fonts and the colours I have choosen.
For web designer is after the demise of Flash with HTML5 and CSS3, animation all the rage again. In the years before animation one had only Gifs to put some motion in. All other elements on a site did plop in in random order by browser will. Now we are able to choreograph the appearance of a website. That’s a big progress.
Yesterday on Youtube I stumbled over a very interesting mini serie about the principles of UX animation (https://youtu.be/8K56_DEjUlE). In the next days I will dive a bit deeper in this topic and find out how I can take this to my advantage.
I assume that in Sparkle 3 will be more possibilities in the animation realm implemented (page transitions, scroll out effects, easing functions – to name a few) and the ability to enable or disable effects for multiple selected items. This would eliminate repetitive (and boring) tasks and left us time to beautify our designs (or have a break).
Well, I like huge fonts.
I love to use them myself. They can be very effective, in print and in web design, if used sparingly.
And I like your description: “… choreograph the appearance of a website.”
I like all the new possibilities we have these days, and Sparkle makes it easy to use them. But that can also lead to overuse of effects, of course … but in your case, I think the “choreography” you want to achieve with the animations is totally okay.
But of course, tastes can (and will) differ …
I will also look at the link you posted, the YouTube mini series … always good to learn new stuff and broaden the perspective …
You’re absolutely right, tastes will always differ (luckily) and only the sky is the limit.
As designer you can make things aesthetically very refined to please your audience but you can also make something very »ugly« (if you dare) and this can serve a purpose as well…
Hi Antonio, thank you very much for showing this enthusiasm.
As I nearly finished the layout for my new site I saw a site (http://www.lionelbole.fr) on this forum that immediately very impressed me. So I decided to discard my previous efforts and to start from scratch and also put some »Wow!« into my design. Now I’m glad that I did.
