Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Which is better to do first, design the interface or write code?

In a one-man project (webpages or desktop applications) where you're both the designer and the developer, what is better to do first, design or write code?

like image 227
perlit Avatar asked Jan 11 '11 08:01

perlit


People also ask

Should you design UI first?

UI (User Interface) and UX (User Experience) are important steps that need to be thought of first, before building software/ web applications or adding new features.

Should I design before coding?

Designing is important before coding as, it will pave a pattern to what you want to code. The design will let you know what to code as well as how to start and keep track of your progress. Without deigning you will always have to alter the code and re-write again.

Which comes first development or design?

In general, most design work comes before development. The website's look, structure, and so on are mapped out, either on paper or as some type of basic mock-up. The client will then approve the design, or request changes. The latter is a lot more common, which is a big reason why this phase comes first.

Do UI designers need to code?

UI Designers do not need to code, but it is extremely beneficial if you have programming skills. Depending on the nature of the product, it's also not unusual for UI/UX design and development to be intertwined into a single process.


3 Answers

By interface I am guessing you mean the user interface, as opposed to an API. I always design the interface first. When I'm coding I'm lazy -- I do whatever will get the job done with the least effort. This leads to interfaces that don't make any sense just because that was the easiest (or cleanest) way to do it in the code. But before you have written the code, you are unbiased and will make better decisions about what a good interface will be.

However -- they will still be bad decisions. You may think you know what feels natural, but you don't. Test it on people! Watch what they do, how they try to use your software, ask them questions and adapt accordingly. If you are doing this often, then it doesn't matter if you design first or code first. This is the way to make a top-notch product.

like image 63
luqui Avatar answered Nov 23 '22 18:11

luqui


I think that by saying "designing the interface" you mean the graphic interface. As PNL teaches, you will handle better things you already see, so visualization helps a lot in the design of a new project.
That's why I start projects following my first visual idea by drawing the mockups of the pages I exactly know how are going to function, with pen and paper (I am happy to read that many esteemed colleagues also do that).

This allows me to conceptualize the application entities (which are likely classes) and functionalities (which may directly be translated into methods).
At this point I write the programming interface, which for me is the most important part of an application both when starting from scratch or for future rework.
Usually it is not a completely new programming style, since many programmers have their preferred patterns and syntax and code to reuse or are driven to some solutions by the framework/environment they have to work on, but anyhow I deem it a pivotal task.

Before writing the code I also design the DB, which use is also delegated to lower level methods used by the interface methods I already wrote (the 90% of projects I worked on was DB-dased), putting down every idea comes to my mind about attributes or side-tables which may better complete the information handled by the application or improve functionalities.

When I have time, I also make some tables and diagrams using Excel, defining the whole CRUD tasks for each table (obviously not every table may need all the CRUD tasks).
This allows me to write in a few time also the general SQL queries, which also reduces the work of writing code, avoiding to switch the attention to other SQL dialects.

I start writing code as the final task, and at this point the work is done.
Writing the logic of the application with the background explained allows me to only think and write in the main language(s) chosen to realize the project, which usually is PHP for server side processing and JavaScript for the client GUI.

I experimented the truth of a phrase one master used to say frequently: a good work is 90% planning, 10% carrying out.
I deeply agree: when a good planning is done, the rest is simply packaging all the pieces.

Happy coding and a lucky new year! :)

like image 39
yodabar Avatar answered Nov 23 '22 19:11

yodabar


From a common sense perspective I'd say a mockup design (think pen and paper) is best to start out with. Define what you want the program/site to do and how it should look without going into details. If you have a clear set goal from the start concerning functions and design on a smaller project implementation order shouldn't be that big of an issue.

I however must say that I always do the code before the design, and I rarely create mockup drafts. Also I never follow my own advice.

like image 20
Anders Arpi Avatar answered Nov 23 '22 18:11

Anders Arpi