Fontastica: a spring update

A few months ago I posted about my final year brainchild, Fontastica. Work has been continuous albeit slow as deadlines for other modules got in the way between times. More importantly, I made the stupid mistake of leaving my pen drive in a computer at university the day before my Christmas deadline. I got home, realised I’d left it there, and was back at uni less than 45 minutes after I’d left, but it was already gone and nobody has seen it since. I still can’t believe it. Thankfully, I had the files on the web already, and all I lost was the half of my final report that I’d already written.

But that’s in the past. I’d like to share a few updated screenshots. :)

Landing page

Welcome to Fontastica

So first of all – welcome to Fontastica! Enjoy your stay. I decided to keep the overall look of the site pretty simple. The overall design is pretty much done, but the code is changing almost daily. I’ve decided I’ll be submitting my Beta version for my final project, then I’ll be recoding the entire thing before its public release, hopefully sometime in April or May.

The basic premise of the site is that you can browse fonts, tag them and rate them against other combinations.

Rating screen

What do you think?

This interface is going to change drastically (in fact, I’m gearing up to do that this afternoon, so don’t get too many ideas), but that’s the overall feel. For the most part, you get given two random fonts, and you can judge whether they go well together or not. Simples. I’d like to write an algorithm that makes the “random” part a little more calculated, but that’s a way off yet.

And then there’s the faceoff, which was pushed for by my tutor:

Faceoff

Which do you prefer?

The idea of the site overall is to keep it as simple, clean and easy-to-understand as possible. Recent user testing has proven that I’ve got a way to go with that. It’s all well and good that I know my way around the site, but if nobody elsedoes then I’m doing it wrong. So like I say, it’ll probably change before the actual launch.

As more people add their opinions – what style of font it is, whether it works well with other fonts, etc. – there will be more stats available for each font, including a list of fonts that others think it goes well with, and – once I’ve got that pesky algorithm working – automated suggesions based on the tags people give fonts. And the best part is that, at the moment, there are no user accounts. You don’t have to sign up. What more can you want?!

So that’s what I’ve been working on, alongside writing an API/client interface and designing a mobile app for reading and taking notes on literature. I have been writing blog entries, but those have been for my Interaction Design module (where the mobile app design is taking place) – you can take a peek if you like, but it’s nothing exciting, I swear. Just an amateur rambling on about user experience research that she knows nothing about.

Anyway – I’d better get to work. I’ve got a lot of interface redesigning ahead of me this afternoon.

by Sophie
on 5th March, 2013 14:17  

filed under The Girl, University, Web Design
 

 
 

Fontastica

About two weeks before the start of term, I was lying in bed fretting over what my final year project could be. I’d half-decided a few months earlier that I wanted to build a gallery-based CMS, something as easy-to-use as WordPress but that focuses on images and building galleries, so that professional designers – with no knowledge of coding – would be able to plug it in and go. But an email from our course tutor that quite plainly stated “don’t just build another CMS” had got me thinking: was this enough? Would it really work as a final project?

So instead I took some advice and began to think about things I like and see if I could come up with anything from there. The list of “things I like” is pretty extensive, but I managed to boil it down to kittens (well, who doesn’t like them?), design (a bit broad) and development (see before). Development is a little linear and easy enough to go about learning, but design is subjective. You can learn it, but you can’t necessarily “get good” at it. That’s what I focused on as I lay in bed fretting. About an hour after we’d turned the light out, I suddenly had a thought. Fonts are a tricky thing. There are some static resources out there for “fonts that go together”, but they’re just that: static. What if I thought about a dynamic version?

That’s what started the ball rolling: the idea of a dynamic font resource. What if you could view two fonts side-by-side and see if they go together? Then you could vote on it – and others can see the result. “Sophie thought Times New Roman and Arial made a good combination! Twenty other people agreed.” At the start of a project, when you’re fishing around for two fonts that go together and going through your library of hundreds of typefaces to see what fits, this is the sort of thing a designer needs. “These fonts go well together and they suit my project!” Bazinga: two hours of mindless font-searching … regained for design.

From there, new parts have just kept falling into place. It can be a resource and a playground. Let users see what the fonts are like side-by-side as a header and body text, let them rearrange and enter their own text, let them export the CSS so they can just drop it in, let them tag and categorise fonts and organise them that way…

I have a lot of ideas for this project and I’m just beginning. Fontastica is starting to take a little bit of shape, starting with a landing page. Now comes the steep learning curve of web scraping and CodeIgniter. This should be fun.

Stay tuned for updates. In the meantime, you can follow me on Twitter or help me with my research by filling in the two surveys I’ve set up: one’s about what fonts you like and one’s about categorising fonts. Let’s see where it goes.

by Sophie
on 8th November, 2012 20:41  

filed under The Girl, University
 

 
 

Adventures in Embedded OpenCL Part 1

So, for my final year project I’m playing around with OpenCL EP 1.1 on a Freescale Sabre-Lite i.MX6 platform. I’m going to try and do some OpenCL accelerated video encoding on it.

To begin with, I did a CPU-only (with SIMD assembly) run through with the encoder, on my i7 2600k-based host machine and my ARM board.

[OK] Videos > x264 --demuxer y4m --crf 20 --threads auto --output output.264 blue_sky_1080p25.y4m
y4m [info]: 1920x1080p 1:1 @ 25/1 fps (cfr)
x264 [info]: using SAR=1/1
x264 [info]: using cpu capabilities: MMX2 SSE2Fast SSSE3 FastShuffle SSE4.2 AVX
x264 [info]: profile High, level 4.0
x264 [info]: frame I:1 Avg QP:20.68 size:179370
x264 [info]: frame P:126 Avg QP:20.67 size:101531
x264 [info]: frame B:90 Avg QP:24.47 size: 13774
x264 [info]: consecutive B-frames: 17.5% 81.1% 1.4% 0.0%
x264 [info]: mb I I16..4: 30.9% 44.2% 24.9%
x264 [info]: mb P I16..4: 1.4% 2.9% 0.4% P16..4: 41.8% 24.7% 17.8% 0.0% 0.0% skip:11.0%
x264 [info]: mb B I16..4: 0.2% 0.3% 0.0% B16..8: 48.3% 3.0% 0.5% direct: 2.3% skip:45.5% L0:31.5% L1:45.0% BI:23.5%
x264 [info]: 8x8 transform intra:59.2% inter:63.7%
x264 [info]: coded y,uvDC,uvAC intra: 53.0% 55.9% 37.2% inter: 30.7% 46.3% 28.0%
x264 [info]: i16 v,h,dc,p: 48% 26% 14% 11%
x264 [info]: i8 v,h,dc,ddl,ddr,vr,hd,vl,hu: 18% 11% 42% 4% 5% 4% 6% 4% 6%
x264 [info]: i4 v,h,dc,ddl,ddr,vr,hd,vl,hu: 24% 12% 16% 5% 13% 6% 14% 4% 6%
x264 [info]: i8c dc,h,v,p: 60% 21% 17% 2%
x264 [info]: Weighted P-Frames: Y:2.4% UV:0.8%
x264 [info]: ref P L0: 69.7% 15.0% 10.6% 4.7% 0.0%
x264 [info]: ref B L0: 92.9% 7.1% 0.0%
x264 [info]: ref B L1: 99.9% 0.1%
x264 [info]: kb/s:13098.54
encoded 217 frames, 15.78 fps, 13098.54 kb/s

And then on my embedded board:

root@freescale /x264/cpu/bin$ ./x264 --demuxer y4m --crf 20 --threads auto --out
put ../../output.264 ../../resources/blue_sky_1080p25.y4m
y4m [info]: 1920x1080p 1:1 @ 25/1 fps (cfr)
x264 [info]: using SAR=1/1
x264 [info]: using cpu capabilities: ARMv6 NEON
x264 [info]: profile High, level 4.0
x264 [info]: frame I:1 Avg QP:20.72 size:178268
x264 [info]: frame P:126 Avg QP:20.69 size:100902
x264 [info]: frame B:90 Avg QP:24.48 size: 13718
x264 [info]: consecutive B-frames: 17.1% 82.9% 0.0% 0.0%
x264 [info]: mb I I16..4: 31.2% 44.8% 24.0%
x264 [info]: mb P I16..4: 1.4% 2.8% 0.4% P16..4: 42.0% 24.7% 17.8% 0.0% 0.0% skip:11.0%
x264 [info]: mb B I16..4: 0.2% 0.3% 0.0% B16..8: 48.3% 2.9% 0.5% direct: 2.2% skip:45.6% L0:31.7% L1:44.3% BI:24.0%
x264 [info]: 8x8 transform intra:58.4% inter:63.6%
x264 [info]: coded y,uvDC,uvAC intra: 52.7% 55.3% 36.6% inter: 30.6% 46.3% 28.0%
x264 [info]: i16 v,h,dc,p: 47% 27% 15% 12%
x264 [info]: i8 v,h,dc,ddl,ddr,vr,hd,vl,hu: 17% 10% 46% 3% 6% 4% 6% 3% 5%
x264 [info]: i4 v,h,dc,ddl,ddr,vr,hd,vl,hu: 24% 12% 17% 5% 13% 6% 14% 4% 6%
x264 [info]: i8c dc,h,v,p: 60% 21% 17% 2%
x264 [info]: Weighted P-Frames: Y:1.6% UV:0.0%
x264 [info]: ref P L0: 70.2% 14.7% 10.4% 4.7% 0.0%
x264 [info]: ref B L0: 92.9% 7.1%
x264 [info]: kb/s:13019.85
encoded 217 frames, 1.01 fps, 13019.85 kb/s

The embedded platform has a quad core processor which ramps up to 1Ghz under load, while the desktop machine has 4 cores hyperthreaded at 3.4Ghz. Considering that it’s pulling in a raw video file over 600MB in size on a class 4 SD card, the board does surprisingly well. That’s not necessarily a fair comparison because the desktop machine is running a copy of x264 from the debian repositories while the arm chip gets one built from the latest source.

Anyway, after trying that I thought I should get down to trying out the OpenCL libraries that came with the pre-built filesystem image.

I grabbed a copy of Apple’s OpenCL hello world program, and with some minor tweaks I got it to run through (The global work item size was exceeding the maximum supported by the hardware). The example program basically multiplies two vectors full of floats, which interestingly enough fails on the embedded platform:

root@freescale /x264$ ./float_hello ; ./hello
Computed '95/192' correct values!
Computed '192/192' correct values!

It seems that the floating point precision provided by the OpenCL interface isn’t up to scratch, or at least hasn’t been set up correctly. Needs further investigation.

by Beige
on 2nd November, 2012 21:15  

filed under The Boy, University
 

 
 

A year of work

There are a lot of people in the Twitterverse who are disdainful of university as a tool to get into the web industry. Not me, for a number of reasons (to be discussed some other time – honestly, you don’t want to see the number of draft blog posts I have on this subject already). But the point stands. In July of last year, having completed my first and second years of university, I finally landed myself an interview at a small Drupal development company in Bristol after several months of looking, and secured a work placement.

That was last July. I started work on the 2nd August 2011 and have been working five days a week ever since, except for the odd holiday here and there. So what’s it been like?

Well, I went into the job … sort of prepared for it. I’d only worked very briefly with Drupal for a two-hour lab in my second year, when we’d had to create some vocabularies and associated taxonomies. Even though I only had that limited experience under my belt, I was taken on board and within a couple of weeks I’d learned the basics of the system. A year later, and I’m pretty competent with it and I’ve even considered migrating this site from WordPress to Drupal, simply because I find it a lot easier to work with, even if it is a lot heavier.

But how did the rest of my courses at uni help to prepare me for all of this?

With my design knowledge tucked under my belt I was able to help with theming a number of sites, and I was provided with the perfect opportunity to actually try out some of the things that I’d spent my second year learning. But more than that, I was able to build on my skills as a novice developer. I went into the placement with a very basic knowledge of PHP, JavaScript and Ajax, and have come out the other end feeling much more confident in my skills. This year I’ve come to understand what it means to use object oriented programming techniques (something that always escaped me before), and I even understand arrays (there are certain people on my course who will understand my frustrations with them last year).

Alongside all of this I’ve become more active on Twitter this year. Being in the midst of the action has meant I’ve been able to discover new technologies and techniques for doing things I’ve been doing for years. I’ve been able to refine my workflow and have taken part in a number of … interesting discussions about all sorts of things. It’s helped to encourage me to expand my horizons even more than I would have done if I’d just been sitting at uni doing the work there.

That’s not to say I haven’t got anything out of my course. If I hadn’t done the first two years, I wouldn’t have had such a solid starting point for this year. I’ve been thrown into the deep end here, but at least I had armbands: I knew the basics, and I knew what I wanted to come out at the end, but being here, working at Circle, has allowed me to refine and clarify what I’ve already learned.

On the other hand, I’ve definitely learned this year that I am an implementer. Give me a design and I will bring it to life. I don’t think I have the creative capacity to come up with the designs for the implementation, but it’s a hell of a lot of fun being the one who gets to implement them. And yes: I’m talking about both design and development.

So. Friday is my last day here. I’m travelling home for a few weeks before starting my final year of university on the 24th September. I’m excited to see what it will bring, and I’m full of ideas and techniques that I want to try out. It’s good for me to know that being here in a working environment hasn’t killed my enthusiasm for the industry (actual work is something that too-regularly drags me down when it comes to something I enjoy doing as a hobby), so I’m eager to press on with my final year and come out at the end of it with my degree.

Here’s to the last year, which has gone by surprisingly quickly. :)

by Sophie
on 22nd August, 2012 10:43  

filed under The Girl, University, Web Design
 

 
 

Why still the hate?

A few months ago I posted about how and why my browser is the best browser there is out there. I still fervently believe this is true, despite the trouble I’ve had with Flash player recently (but then again, who doesn’t have trouble with it?) and despite Firebug spontaneously dying. I don’t like the new update cycle but that’s just personal preference. Sometimes (as I pointed out today on Twitter) I could swear blind that my context menu rearranges itself so that the Firefox inspector link is where Firebug usually is.

But overall, I still like Firefox … and for some reason, it’s become the butt of a great many jokes on Twitter.

It’s now come to the point where I think twice or thrice about posting something to do with Firefox because there are some people who will immediately jump on me for it. “It’s just a joke,” they excuse themselves, “I only do it to wind you up!” But does that really make it excusable? The number of times I did something just to wind my brother up and would get told off by my mother suggests that’s not an appropriate excuse. So why does it count here?

Now I will concede that on occasion I poke fun at Chrome users. I’m not perfect. But I don’t leap on anyone as soon as they mention using Chrome, because ultimately it’s their choice of browser, and if it works for them then that’s fine. Even with IE – a few years ago I wouldn’t have thought twice about responding to an IE user’s plea for help with “get a proper browser”. Now, I’ll try to fix their problem and then suggest they consider a different browser. Ultimately, they have a different workflow. It may be harming my productivity in one way or another, but if they don’t want to change, then why should I force them?

I have legitimate reasons for disliking Chrome. Actually, I like Chrome’s interface and speed, but I don’t like its inspector, nor do I like the way it renders some things and that some of my add-ons aren’t available. Perhaps there are alternatives in the Chrome store or whatever it’s called but I’m not interested in finding a replacement. Similarly, I could list the reasons why I don’t like using Opera, Safari or IE. I’m sure each and every one of you has a reason for not using a certain browser. It’s not just because I’m stupid, believe it or not.

(Insert a tie-in to religion: you hate it when people try to force your religion on you, but you’ll quite happily try to force your browser on others …)

In the last few weeks I can cite several different occasions when people have made mention of the fact that I use Firefox in a derogatory way. “It’s just a joke, get over yourself,” you say, but when it gets to the stage when people “pity” me for “having to use it”, is it a joke? Is it just a joke at my expense? That seems a little more far-reaching, to me.

Since I started university, coursemates and peers alike have suggested that I’m somehow “inferior” to them because I don’t use an Apple computer, and that people who use Chrome are somehow better than me. It was a massive hit to my self-confidence in the first year, even though it was “just a joke”. I was able to produce websites that were just as good as those who used a Mac and Chrome could, and achieved grades that were just as high, but even so the words stung and I spent most of my second year trying to shake it all off.

Even on unrelated things, people still quip about my use of Firefox. Even when confronted about it, they remain chipper. Just a joke.

I suppose, then, since everyone thinks this is “just a joke”, I shall just stop worrying about it and stop letting it get to me. But it would be nice if I could start mentioning the browser I use without fear of people commenting on it. Perhaps that’s too much to ask, though. After all, people have been trying to get the web ‘verse to be nice to each other for a while.

by Sophie
on 31st July, 2012 16:37  

filed under Personal, The Girl, Web Design