Daily UI Challenge 001 — Login Page
It is a great opportunity to have Daily UI 100 Challenges as practice projects, especially for those who want to quickly build multiple portfolios like me 😂.
I want to be a professional UI/UX designer in my long-term career, although I have nearly 3 years of the experience in front-end industry, my job is not fully focus as a UI/UX designer and in most of time I am a software engineer.
This article is a learning reference for myself, but it will be great if I can share to the ones who can get some inspiration or some design hints from my artwork 🙂.
The first practice of Daily UI Challenge 001 is to design a login page. Instead of JUST designing one single UI wireframe, 👉I would like to think in a much comprehensive and systematic way, meaning I prefer to to design a scenario and then include login page into this scenario which I created. By doing this, the 100 challenges will not just a single page, but each challenge will become a compete project and, your portfolio will indeed look much more like a real project and will have benefits towards your next interview hopefully.
So, from the first challenge onwards, I will ask myself to answer the following questions for each challenge. And, I hope by answering the questions, you will have much deep understanding of your UI creation, as well as this is also a process for enhancing design thinking.
✍ Before you get the challenge, you can start asking yourself the questions:
1. What are the potential issues that can be solved from today’s UI interface practice?
2. Can my UI design solve the issues that I assume?
3. Can the UI design improve the process of the app? or, can the UI design improve the things that can be done better?
4. After create the UI design, can I explain all the wireframe AND each steps clearly?
5. Is there any other issues (potentially) exist in my wireframe? how can it to be improved?
======================================
Finally, here comes the design!!!
In my Daily UI Challenge 001, I have created a travel-reminder app which is called ‘SFloper’. In the SFloper app, users can see their travel itinerary both from the upcoming schedules and to the records of history.
Suppose the user choose to look up their upcoming travel itinerary, he/she can view all the upcoming itinerary ordered by the time list. If, the user clicks into a particular one itinerary, then they can see a detail itinerary for visit. In my design, I take the example of Finland family trip for 8 days. Thus, as soon as I click on the itinerary of Finland, the place I would like to visit will be presented — here, Helsinki City Hall for example.
In this app, as you click the itinerary, the destination will not just show up but the user can also click the button of navigation — letting them know how they can get to there from the current place (i.e. it combines with the google map into it). As the user reach to the destination, he/she can also check-in the visited place and share to the social media like Instagram or Facebook. They can, on the other hand, delete the destination if no further action needs to be executed.
Back to the main app page, the user can also choose other actions like give suggestions to the app development team, share this app to friends, or even switch the language according to their preference.
Each UI wireframe page demonstrates simple functions on it, without too much complicated ones. And ideally, the user can use the app in a very straight-forward view without any issues or difficulties (hopefully?!)😆.
Thank you for reading!!
Hope I can have more time to share my design work, and I expect myself to design something BIG one day in the future to make this world bit better.
