I have been learning web development for about 2 years with some breaks as I am working as an IT technician and sometimes it can be uneasy to get some free time and being dynamic to concentrate on a project.
One of my hobbies is taking pictures, I like photography. And recently after making my cv online, I thought about making a photo blog using Gatsby.
However, I think that most of the time, I go straight up to the development phase by started the HTML structure. Unfortunately, and I think you guess it, it starts to be messy as I haven't made a plan!
I have started to think about it and I know this is how you have to proceed to be efficient and not being lost like me.
That is what I try to set in mind before starting my project :
- define a sitemap
- create a wireframe
- define graphics
- start development
If anyone as any advices or plan to follow in order to make easier to start a project, I would appreciate.
I would be interested also to know how much time you spend on it. Of course, I guess that the first sketch won't probably be the only one and that most of the time, you have to change plans.
Thanks for all your advices
Latest comments (9)
I'd also add a step before the sitemap.
Collecting inspiration. I like to draw on paper, screenshot websites or themes or widgets I like, collect links to tutorials and existing sites.
Its like a moodboard on Pinterest.
It helps you pick up design and structure decisions, whether deliberate or subconscious influence. And you can figure out what resonates with you. Maybe the pink and yellow bright sites by your favorite photo bloggers or instagrammers make you inspired. Maybe the old fashioned font and black and white artist photos next to the mysterious bio speaks to you. Maybe the minimal design and soft buttons of a famous photographer's site speaks to you.
Here is a gallery site of mine, forked from another repo.
It is built on Jekyll. You might like the theme or the pop up experience or the menu or the fact that large size images are in the repo and they get outputted as a fast loading thumbnails at build time thanks to a plugin.
Write down words and ideas that you like. How do you want someone to feel when they look at your site? Who is your audience? what is the main goal - to email you, to buy a print, to follow you on social media? Make sure that the design you choose honors your written intent for the site.
That's a great plan.
You might also decide that deploying a site with one page only and just 3 images is your first goal. Then you have that as a milestone to anchieve, which you can build on top of and feel good about and it can be shared with people. Rather than attempting to build out a site with 10 pages and 50 blog posts which never feels finished and then postponing deploying it. As another comment says, an incremental approach is good.
Then with the core site or prototype (even if it is not URL you share with people yet) you can go about adding more images, optimizing images, adding more pages, writing content, etc.
I absolutely agree with slowly deploying ideas or websites.
Start simple then build sophistication.
I like to say KISS; (my version is) Keep it simple & short.
Your numbered bullets would be a great start for a mind map. ;)
Do you know FreePlane? I love it.
That's a fine plan you have already! A lot of it depends on the project itself, and what your goals are. For example, if you know exactly what you're going to build up front then getting all your requirements down, the design finished, and then starting to code is a great way to do it!
For me, most of the time, I have no idea what I want to build. I normally take an iterative approach. I'll start with designing part of my site - say a homepage. Then I build it. Then I test/deploy and start working on a different part of the site. I don't always stick to this rule. For example, if I design a homepage with blog posts. But I haven't coded that functionality yet. Then I might build that functionality knowing that it's rough and I can iterate on it later.
I really enjoy this process. It feels like I'm polishing a feature over time. And it means I can get to building faster. I don't spend too much time on planning.
I would create a design using Figma first before building it 😁
I have used Wix before to mock up a site because I have access to widgets I can drag and drop.
Then in a few minutes I have something I like or a few different versions I can compare (full screen carousel vs grid gallery? Dark or light theme?)
Then I can go and build it from scratch using code and a static site theme.
Cool I have been meaning to try out Wix and Squarespace for experimental reasons.
I will look at figma, thx