What “Seinfeld” taught me about being a better designer.

How I designed and built something with basic HTML/CSS/JS knowledge.

Often times when someone approaches me with an idea or a request I try to listen as much as possible because you never know what can grow from that. If you listen to respond, then most likely you will never get the essential part of any idea/request.

What was needed?

They needed a tool where they can add/edit/delete in real-time their earnings in a simple yet familiar way, basically a spreadsheet. Also, they wanted to be able have an user and password in order to access this.

What I did?

As I said before, if you’re not paying attention and see the big picture, the first reaction might be: “WOW! This is a kind of complex/big/hard, it requires some serious development skills which obviously I do not have them because I’m a designer and also the budget may be too small so I better refuse this, which seems a pretty reasonable thing to do.
So, instead of doing this, I did the opposite of what I’m normally doing. So I’ve decided to take it and build it without knowing where it can lead.

Find out what existing tools are solving this problem at the most basic level.

I’m a strong believer in “Don’t reinvent the wheel if it’s already invented.” so I’m absolutely sure that I might find useful resources to help me not just design it but build it also.

Finding the resources.

They wanted a place of their own where they can be able to have an user and a password to log in.

You don’t need to be a developer to know that WordPress allows you to get this started in no time. You just need to search for it.
And WOW!, all of sudden, you have provided the client a solid and secure infrastructure where he is able to create a user and a password in a secure way.

The next thing that they want is the possibility to add/edit spreadsheets in real time inside the website.
I know, I was thinking the same, I might use google spreadsheets or something similar and embed it into the website.
There are few downsides, if you embed a spreadsheet in your website you can not edit it and the other one is that you don’t get a sense of using your own product.

Okay, what can I do?

Again, it might be a good idea to search for a resource which might allow me to have a basic spreadsheet. I am pretty sure that there might be something available with a similar kind of functionality.

Voila! It took me 1–2 hours to find a good suitable plugin which can allow me to do what what is needed and another 30 minutes to find a plugin which can allow me to put a login form on the website.

Now let me tell you a little secret: if you requested this from a developer he will charge you serious $$$. No problem with this, but you did the same thing. Of course, many developers will think that “yeah, but you basically use someone else code” or whatever. The client will be very affected if he will find that I used some snippets written by someone else. Basically, he will be devastated. He will not care if the code works.

So, to be a bit of a life coach I have to say that you must avoid being scared of the unknown.

Let’s have a short recap:

Without being a developer, I’ve managed to have a functional website with a front-end login form and a real-time editing spreadsheet.

I guess you can imagine what you can do after you have the core structure functional.

You’re right! You can add your own touch to it.

With just a basic knowledge of HTML/CSS you can really transform a not so good looking but functional tool/element into something appealing, it’s up to you.

Some people are saying that Apple is doing the same thing, takes what it already exists and put some glitter on it.

There are very high chances that whatever you might want to build already exists at some extent, especially for smaller projects like this one.

Personally, this is how I’ve learned HTML/CSS/JS.

Approaching projects with this kind of mindset will definitely make you a better designer.

I strongly recommend to try, at least for a personal/side project to do something like this and you will see how much of a difference it makes to design and build something without having to be a professional front-end or back-end developer. You will learn code just by tinkering with someone else’s code and the learning process it’s so much easier, quicker and most importantly engaging because you will see the results immediately.

If you like this article I will probably write more in-depth articles explaining how to do this exactly.

Dare more! Be more like George.

Thank you!

You can say bad things about this article here @agispas