As young developers, we often have a working knowledge and skills needed to make a software. But there is still a huge gap between the know-how and real-world application of those abilities. Like a normal college student, while I could write code and make programs, the very thought of creating a real software was scary, confusing and overwhelming. I think it mostly stemmed from the fear of the unknown. We often do not know about the complexities of a real software, the tools that are used to make one or the process involved in making it. But this all changed rapidly as I took my first steps into the ‘real world’.
I am a product development intern in the front-end team at Appointy. We design the UI of products. Sure! Sounds cool. But what does it really mean? What do I do? How do I do it? To know that, we need to dive in a little deeper into my job here.
The 101s
The front-end team works on the look and feel of the product. We are responsible for how the user experiences our product. While designing the user interface, a popular approach is to create small yet very versatile pieces of the UI. The UI itself is made by bootstrapping those pieces in the required way.
Different people use different terminology for those ‘pieces’. A React developer would call them elements and components. A Flutter developer would call them widgets. At Appointy, we simply call them components. The entity made by combining those components is called a widget. Widgets are simply a collection of components that work together and share data amongst themselves. My job here is to make components. So far so good.
Designing a component
Components are fundamental to the UI and hence, must be logically sound, stable and flexible. I usually follow the below steps while designing a component:
- The first step is to look into the reason we need it. That helps me decide the functionality of the component and all the customization that can be made to the component.
- When that is done, I get to research part. This is the core of designing a component. I browse various repositories, blogs, documentation & videos and find out the ways to achieve the needed functionality.
- At the end of the research, there can be two outcomes. First, there is nothing solid to start from. In that case, I work on the core logic from zero and work my way up. That is simply done with a pen and paper. Secondly, there is an existing codebase to start from. If that happens, I make a plan to integrate and shape it into the needed form.
In the end, I come up with a crude design of the component. I start working on it and polish it on the way. It seems a little scary, doesn’t it? But there is a process involved here – the “How” part.
Making the design come to life
After thorough research, the design is to be converted into code. Just like the design process, this process is also done step by step.
- I sit with my mentor and discuss all the details of the design. This usually provides clarity about what is to be done and how to do that. In case there are hidden complexities that are revealed later, we sit together again and iron everything out.
- In case the component is too complex, I start with a basic design and then iteratively add features and enhancements to it.
- The very complexity of writing a component can be overwhelming. As you might know, a good part of effort, energy & time goes into setting up a development environment. At Appointy, we have boilerplates and a standard environment so that you can directly jump into expressing yourself via code without worrying about trivial details.
- We follow the Agile model of software development. In Layman’s terms, it means focusing on getting the work done without indulging into too many formalities. For example, instead of tediously making documents and mailing them, we have daily stand-up meetings to discuss our progress. This is quicker and much more efficient as all the interaction is face to face.
When all this is done, an iteration of component is ready. The design and code part are followed-up iteratively until a satisfactory component is created.
My experience with the entire thing
This truly has been an enlightening experience. Not only did I learn how to create a real-world product from scratch but I also learned a lot of useful things along with it. I now know how to choose the correct technology for my software. I know how to think like a user. I can make a software that is not bound by linguistic barriers and is accessible to everyone in the world. All of this can only be perfected with experience and practice.
While I have only started my journey as a developer, I gain more confidence and knowledge day by day. It is often astonishing to see the leap I have taken from back when I started and it is equally terrifying to look ahead and peek into the never-ending journey of learning and growing. But I know that I love what I do and that drives me deeper and deeper into this huge world of software development.
