Khiro95
Features & Improvements
As-sallamu 'alaikum @Khiro95,
This widget is exactly what I was looking for but had a hard time finding it. As an end user, there are some improvements I would like to suggest, let me know what you think.
Interface
The current interface is modern looking but cluttered in some aspects. Adding options to hide certain elements would make the UX and look even better. I made a quick redesign mockup below, call it a compact mode. People should have the choice of regular or compact interface.
Project discovery
As I said above, the project was quite hard to find, as it's relatively new. I added the project on AlternativeTo, hopefully it will attract many muslim brothers and sisters to use Awqat Salaat.
Project name
On the project's README you say that the new version of Awqat Salaat has WinUI to fit Windows 11 criteria as it doesn't support Deskband anymore. But Windows 10 has reached EOL and imo you should rename the current WinUI version just "Awqat Salaat" and the older Windows 10 compatible version as "Awqat Salaat Deskband" for legacy users. Better branding on GitHub and Microsoft Store.
Localization
Currently the app is only available in English and Arabic, as the project is free and open source. It would be beneficial to have a translation panel like Crowdin or Weblate to let the ummah contribute with translating this project in multiple languages (Corwdin is easier to use for beginners imo). The use of these translation services are free for non-profit open source projects. You should consider it for the future insha'Allah (no extra work on your side and good way to attract global users).
Dynamic position
Currently on Windows 11, when you open a third party app that is pinned in the visible system tray, the little arrow to expand tray icons gets buried under the Awqat Salaat widget if you position it to the far right, is it possible to add a feature that dynamically moves the taskbar widget when it feels like it's hiding a taskbar element ? Don't know the difficulty level of adding such feature.
Wa Alaikum Assalam @realgooseman,
Thanks for taking time to write this nice feedback :) And I'm sorry that you had hard time to find the widget :(
So here is what I think about the points you have mentioned:
Interface
Firstly, please excuse my bad UI/UX skills :P
I'm good with giving users the option to choose from different UI layouts and styles, as long as I can come up with some good designs, in addition to your proposed design.
Project discovery
Thanks so much for your effort in helping people to find this widget, jazak Allah khayran.
To be honest I barely know anything about marketing and advertisement. So my best move was to publish Awqat Salaat WinUI on Microsoft Store. Any help or advice regarding this topic is highly appreciated.
Project name
I think I can't agree more with what you've said. Apparently the WinUI variant is used more than the deskband variant. Although I don't have any statistics to make a precise judgement but I'm saying that based on the feedbacks received here and in email.
I will seriously consider making this shift in the next major update.
Localization
I will be happy to have the widget available in other languages. I will check the services you mentioned. Thanks a lot!
Dynamic position
Indeed, the position of the widget is one of the hard, if not the hardest, challenges in the implementation. And the difficult part here is the automatic detection of the changes in the taskbar. Sadly there isn't much means which we can rely on beside watching the registry and listening to events from UIAutomation. Unfortunately, these two techniques don't cover all scenarios including the one you are speaking about :( Eventually, I may be forced to use a timer.
Again, thanks for showing interest in Awqat Salaat and for contributing to it :) Jazak Allah khayran
I appreciate you taking my suggestions into consideration.
Interface : A general compact mode inspired by my redesign could replace the existing "Compact mode" setting in the future. That existing setting is a good place to implement a future updated UI. If considered.
Marketing/advertisment : I'm not that good at them either but open source developers don't usually do marketing campaigns to promote a free project. What I would recommend is to publish the project on as many directories as possible (like AlternativeTo), post about the project on relevant subreddits on Reddit, publish blog posts or video showcases on YouTube to promote it at close to no cost.
Localization : I would definitely contribute once localization is implemented. Crowdin is easier to use for beginners in my opinion. I believe the project can be submitted for free via this link.
Dynamic position : Not that much of a deal breaker. You could also make the window show up when clicking the system tray icon for people who want to hide the prayer time on the taskbar (and thus avoid that position issue).
Jazak'Allah Khairan and have a good iftar.
The existing "Compact mode" is used only for the widget button on the taskbar since some people found it a little large. So it's unrelated to the widget panel that appear when we click on that button.
Thanks for the nice recommendations!
Jazak'Allah Khairan and have a good Suhur :)
As-sallamu 'alaikum brothers
I love the app and would like to offer some features too.
First: this widget is put into the corner of my taskbar and it bugs me from a designer’s perspective to have a centre-aligned text there. I suppose it’s very easy to create a setting for left-aligned text and I would greatly appreciate this.
Second suggestion, which is more of a nitpick: the reminder is quite active. Maybe an option to have a small dot (like a bullet point •), which will flash in the same manner? People are good in detecting movement and action even in case of small objects like this.
Pic related
Thanks for the app! Jazak'Allah Khairan
Wa alaikum as-salam @magvag
I'm glad you liked the widget, and thanks for suggesting improvements :)
And I'm very happy to have feedbacks from designers since my UI/UX skills are poor :P
Recently, I have received many feedbacks and suggestions for UI-related features, so apparently I will be doing a design-only update soon :)
Let's discuss your suggestions a little:
Left alignment
I'm totally fine with this suggestion and insha'Allah it's easy to implement it. But should it be applied in the case when the countdown is visible? Left (right on RTL OS's) alignment is really perfect when the countdown is hidden (or when compact mode is active) and the widget is located at the corner. So I need to know if it's applicable for the regular appearance of the widget.
Visual notification
It will be nice to have different ways to visually notify the user when the coming prayer becomes close, but I'm afraid that a bullet point is insufficient, especially if the widget is at the corner. It's easy to miss changes of small parts in the areas that are away from the user's focus. I also would like to know what's the issue with the reminder being "quite active"? The prayers are very important so the user should be highly reminded about their times :)
Please let me know what you think. Jazak'Allah Khairan for contributing to the project.
About left alignment: Absolutely applicable in all cases, you should google Swiss style for some cool left-aligned designs. I feel like you want to create an app that feel like a native Win11 app, and Win11 uses center-aligned text nowhere, especially not in their widgets. P.S. check the font sizes for both parts of full widget, i feel like After is 10px while Isha is 9 (this also messes with the horizontal alignment, that I‘ve fixed in Photoshop in picture below)
About reminder: the prayers are important indeed, the notification dot is just my minimalist preference, forget about it.
I‘ve turned the reminder back for this comment and understood, what I meant by overly active and what can be easily fixed.
As you can see on the screenshot, at some point during reminder animation the background color turns dark orange (at least with the light theme), and the text now is slightly hard to read (compare it with the background color in the prayers list: it’s only 6% darker, yet you rightfully chose to make the text white here)
If the animation endpoint color will be less intense (or perhaps customizable with Notification Color setting), it would resolve all of my concerns. Besides, Win11 notifications are pretty subtle and this change will make the app feel more coherent with the rest of the system.
Jazak'Allah Khairan for your hard work
Thanks a lot for the clarifications :)
I like your screenshot of the left alignment. No idea why I didn't try this before.
For the background of reminder notification, I agree with you 100%. However it was easier for me to leave it like that because changing text color implies some difficulties, thus I decided to keep it like that since it appears only for a very short time. Also, the contrast ration is considered good (8.4 according to some tools). What I mean by difficulties here is that animating the text color would result in a point where both animations cross and the text is again slightly hard to read.
Also, I guess you would have the same comment on elapsed time notification (some people like to know how much time passed since the adhan)
I skipped this one due some technical difficulties in the UI system, but since I'm going to make a design-only update I think it's a good chance to fix it.
So back to the reminder, I need help in finding the right time to change the text color and how (i.e. with or without animation).
Have a good suhur :)
I’ve also checked the colors by contrast checker and they do indeed have a nice contrast ratio. I’m thinking that the lower the contrast ratio is, the more a user need to spend time reading. Thus it will be hard to check the time of nearest prayer at a glance in those 5–10% of time when the animation is at it’s darkest. Can’t back it up by facts tho :)
No need to change the text color midway through animation, it creates some nasty gray text in the process as you have told. A very easy fix would be to make reminder and elapsed time notifications endcolor less intense and more in line with Win11 style — then the animation will look very nice. Below is the example of a standard app notification that can be used for elapsed time animation — you can just make an orange of same brightness for the reminder.