New mixes page

Today I made live a new design for the Mixes page. The Mixes page was actually the first on this site and existed before anything else was actually here (i.e. if you visited the home page it was just blank), and was also my first attempt at using all the new HTML5 structural tags, and also the first time I played around with some of the less commonly supported CSS3 modules like transitions and transforms.

Screenshot from the Isotope website

With the rest of the site launched with a different design, I felt I should probably bring the Mixes page in line with everything else, and so now it does with a bit of extra imagery and functionality thrown in. The new design takes the experimentation with CSS3 even further with multiple background-images, CSS columns, generated content, more transitions and transforms, and of course, media queries to modify the design depending on the width of your screen.

And on top of that, I'm also using the awesome Isotope for filtering and sorting of the mixes, and MediaElement for adding HTML5 audio to each mix so that they can be streamed rather than downloaded (if that's what you prefer to do).

I add new mixes to the page every 2-3 weeks so it's worth checking back frequently if you're into that sort of music, or subscribing to the feed.

There have been no comments on this entry so far. Why not be the first?

New mix — Inner Peace

First post about music on this site and although it wasn't really planned that way, it's also about the first Goa trance mix I've done in about six years, Inner Peace. I don't really listen to this style of music much nowadays, but I have become a fan of Ektoplazm, which is probably the best source of free psychedelic trance music on the 'net, and as Ektoplazm releases psytrance in all it's different forms, every now and then it drops a Goa trance release with some decent tunes on it.

Cover for the Pantheon compilation
One of my favourite tracks on this mix,Is Pause No, by Blackstarrfinale comes from the Pantheon compilation.

Nearly all of these tunes are from the Neogoa net label (which will actually be closing down at the end of the year), with a fairly diverse array of artists. Although Goa trance is probably the first type of dance music I bought on CD way back in the early 90s, it's not my favourite type of trance music any more (although I still dust off some of the mixes I did every now and then), but it was a nice change to mix something a bit different.

Standout tracks for me are the two by BlackStarrFinale which have some nice 303 action going on. I love a good acid line and a lot of my favourite Goa tracks feature them and that's what's make these tunes so appealing too.

There have been no comments on this entry so far. Why not be the first?

So what’s this all about?

Some of you may have come across my other site. It's been going for a few years now and badly needs a redesign which is something I've been working on for a while (over a year in fact), but haven't been getting far with. I've thought about things like site structure and content (having rewritten quite a bit of it), but whenever it comes to actually trying out new ideas for how it will look (designing both in the browser and in Fireworks), I only get a little way before getting dissatisfied and discouraged with the process.

So I thought maybe I should try working on something completely different, to see whether a new personal project would open up some creative channels and get ideas flowing. And so I decided to work on this site first instead.

It's actually been something I've thinking about for a while: I wanted a site that was separate from my freelancing business where I could blog about anything I felt like, and not just topics related to web development which is what Tyssen Design became (and that was completely by design as I didn't think a business site was the correct place for discussing just any topic). I also thought that being able to write about anything might get me back into the swing of writing/blogging again, because it's been about 18 months since I published anything new on Tyssen Design.

There are a few different reasons for the drought in new content on Tyssen Design, most of which will probably just sound like excuses, but as this site is a personal one, I intend to use it as a playground to try out a bunch of new stuff, some of which has already been included in the current design. And hopefully that proces will lead to new opportunities to blog about my experiences and what I've learned. I've already got a few ideas up my sleeve based on the process of building the site up unitl now.

Screenshot of the source code for this site
Ooh look, shiny new tags!

The skinny

The site is built with ExpressionEngine, HTML5, CSS3, jQuery and media queries. The site uses the Multi Site Manager because I'm also using it to run Tyssen Design. I'm using a few different add-ons, but of note are Tagger and Disqus which I'm using for the first time on this site.

I used the rather excellent Gridless as the starting point for the CSS, which provided a foundation for both working with media queries and good-looking typography. Fonts come from Typekit (Harfang Pro for headings), icons come from the Pictos set, and I got help with working out modular scale and vertical rhythm.

Media queries and working with a baseline grid are two other techniques I'm trying out for the first time on this site. Using media queries has worked out OK, although with what is essentially a single-column layout, there weren't too many parts of it that needed to be considered for refactoring at different screen sizes. I plan to write more about responsiveness/adaptability and testing for mobiles soon.

The vertical rhythm/baseline grid was something I had a little more trouble with. I guess like anything, when you first start using something, before it becomes familiar, it takes a lot of trial and error. I spent a lot of time toing and froing, playing with different line-heights, margins and padding, and using GridFox as a visual guide to make sure everything was following the baseline I had set. I changed my mind a bit about what font sizes, spacing and even measure I wanted to use. Gridless is set up to work with the Golden Section (or Ratio), but I felt more comfortable using the Musical Fifth or 2:3. My maths is probably a bit off with some elements; in some cases I just lined things up visually and used Firebug to get things sitting on grid lines.

The elephant in the room

As this is a personal site, a playground for messing around with web stuff, I don't feel the need to be as diligent as I would in my work for other people in ensuring cross-browser compatibility. I work on a Mac so develop in Firefox with Chrome and Opera close companions, but if something doesn't look quite right in you know who, I'm not going to lose too much sleep about it. I hope that the design of the site will constantly evolve, and as I'm adding new features or styles, I may be a little bit tardy in my checking of things in IE. In fact, so far, I haven't been that rigorous in testing at all, I just wanted to get it up and out there and refine it as I go along. So if you spot anything that you really think looks busted,  please drop me a line.

An admission

Even though I've been using ExpressionEngine for about four years and in that time have built more than 70 sites with it, up until last week, my own site has actually been running on Wordpress, and actually part of it still is. I found Wordpress a couple of years before I discovered EE and I had intended that I'd move it over onto EE at the same time as redesigning it. I actually set up a local EE install about 18 months ago as I started work on restructing Tyssen Design and rewriting content, but with no new design to actually go with it, never got around to making the switch to using EE as the full-time CMS for the site.

Finally I decided that if I was ever going to get anywhere with it, I needed to break it down into smaller, less daunting chunks, and so decided to just recreate the current site within EE. But as the bulk of the content is in posts on the blog, content I intended to leave alone and not rewrite, I left all those and their associated comments inside Wordpress. So currently I've actually got two CMSs installed running side-by-side, although I'm not using Wordpress for anything other than serving the old content. I still intend on bringing all that Worpress content over to EE, but that's a task for a later date.

Moving forward

As I said earlier, this site has been something I've been thinking about for a while, and the site has actually been in existence for a little while already, although the only page has been the one for my mixes, which I add to on a fairly regular basis these days (a new one every 3-4 weeks).

But hopefully, now that I've broken the fetters that have been holding me back from both designing and writing for myself, you'll see some new things appearing here regularly.

There have been no comments on this entry so far. Why not be the first?