Skip to content
 

Web Design is Scrappy

Topics

Published:

If you had to describe my approach to web design in one word the word would be scrappy. I rather get something to work fast than agonize on details. It is going to take a fair amount of iteration no matter what. This site is a good example of scrappy design.

Getting Scrappy
#

I started from a base design created by Andreas Eldh. We have developed a static site generator known as Antwar together. Incidentally it is based upon webpack and React. And Antwar itself is based on an experiment by Brad Denver. Feeling scrappy yet?

As nothing is harder than evaluating your own work I looked actively for feedback during the development process. I had to develop Antwar further in order to reach my goals. Besides the technical part I also had to make sure the content is accessible and that there’s marketing copy in place.

The design is scrappy in sense that I integrated ideas from various sources. Sometimes I might realize something randomly and will just add it there. A good example is the recent addition of commenting per chapter. I understood it might be a nice way to get some extra feedback on content and help me to see potential problems clearer. And given it was fast to add, it made perfect sense.

Services to Support Scrappy Design
#

Besides asking for feedback from friends and sometimes total strangers I used a couple of services with varying results. Out of the services criticue (now defunct) worked the best for me. Often it’s the negative feedback that helps you the most. Criticue helped me to prune out the worst mishaps.

As I had good experiences of Feedback roulette (defunct now) in the past I set it up too. Unfortunately I have yet to receive single useful round of feedback even though I have a single credit for testing.

Five Second Test was useful for getting answers to specific design issues. I didn’t use it a lot, though, but I can see its value. The response times were adequate as well.

All of these services allow you to earn credits by providing feedback yourself. Even though this takes time it can be enlightening to see designs of other people and help them to improve. Perhaps over longer term you might develop a stronger intuition for design.

What Next?
#

I believe the current design of the site is quite passable. It doesn’t remind me of the 90s too much at least. I’m sure it could be better in some ways but as they say you are blind to your own work. I have outlined some issues I’m aware of at the site issue tracker. If you have any ideas, please set up issues there for me to study or comment on this post.

I would love to have more functionality on the site. Even though Disqus comments work I believe Medium style commenting system would work better for books. Unfortunately I haven’t been able to find a suitable 3rd party service for this purpose yet.

It would be nice to have more interactivity. Web as a platform would allow that but of course it’s going to require a lot of work to pull off. That said if you are aiming for the maximum amount of awesomeness, go interactive.

What Could Have Been Done Differently?
#

I would have probably saved a great deal of time by going with some established solution such as WordPress or Jekyll. GitHub Pages supports Jekyll particularly well and I have even written a scrappy guide for it so I know the topic. I’m also aware of the limitations of Jekyll. Developing Antwar gave me a good excuse to learn more about the topic.

Whole site design could have been bought from elsewhere. Same goes for marketing copy, photography and such. In fact this given me a good excuse to work on these skills. That said it may be a good idea to use professional services in the future. After all they have spent years honing their skills and will be able to get better results faster.

Conclusion
#

I hope this brief post gave you some idea of why the site is the way it is. If you like the design or just want to study how it has been made, check out the site repository. The source itself might be a little scrappy in parts but that’s to be expected. It’s a scrappy design after all!

I suppose the nicest thing about working on a webpack and React stack is that it gives me a nice amount of flexibility. I can build layouts using React and author using Markdown. That’s the best out of both worlds. Antwar is still missing some of the functionality you might expect (pagination, tagging etc.) but it keeps on growing as I use it. No need to aim for perfection the first time around.

I feel web design is scrappy by definition. It is hard to get everything right the first time around. It is a good idea to leave room for creativity and experimentation. I suppose taken further you would start running tests on your site and looking at the numbers. So far my approach has been guided by intuition and might not be the best when compared to data based approaches.

Comments
#