Dates
Start Date: June 11, 2021
Due Date: June 30, 2021 (by end of day, Pacific Time)
Payment
Each entrant is eligible for a payment of up to $500, with a minimum of $200 if the entry meets the minimum standards. The exact payment amount for each entrant will be based on the quality of the entrant’s work.
Description
The goal of this Challenge is to make a notification system that is easy to use, visually appealing, and flexible. Notifications are used in almost every game, and are an important part of the user interface.
Notifications are those little pop up messages that inform the player about things during gameplay. They often appear on screen for a short duration, and then are removed. Multiple notifications can appear on screen at once, in which case notifications are stacked to make room for the new messages. Notifications are designed with UI components and styled with elements such as text, backgrounds, borders, images, and colors.
Examples
The games below have some good examples of notifications. When reviewing these, take note of the graphical design of the notifications, their size and location, their content areas, and how they move on and off the screen.
Farmer’s Market by ManticoreGames
-
Plant multiple strawberry plants, and then view the notifications that come up when each plant is ready to harvest.
-
A different notification is also displayed when you complete a quest in game.
-
Another notification is shown when the market opens and closes.
Mergelandia by ManticoreGames
-
Notifications are shown in the upper left side when the other players do something in game.
-
Note that this notification has two different text colors, as well as two image areas.
More Ideas
- Play any PC or mobile game to get an idea of how other games show notifications.
Features
Some of the features to consider when building a notification system are listed below.
Container
The width and height and location of the notification area should be easy to customize by the user. Your system should be responsive and optimized for custom dimensions.
Individual Notification Size
Decide if you want the individual notifications to have the same size or be variable in size. Consider how to handle text that is too long for the text content areas. For example, you could truncate the text and add an ellipse. Or you can dynamically adjust the height of the text area to show more lines of text.
Duration
Define a default duration for each notification. This default should be customizable by the user. Allow individual notifications to override the default duration.
Animation
Animate your notifications when they appear onscreen and offscreen. Fading, movement, and easing are all ways to animate your UI elements.
Multiple Notifications
When multiple notifications appear on the screen at the same time, consider how to display all the notifications. A common method is to stack the notifications vertically, with a customizable property that defines the direction (up or down). Notifications are then removed individually, with the older notifications being removed first.
Content Areas
A single notification can contain multiple content areas, depending on the type of notification. The most common content areas are text areas and image areas. Audio, such as notification sound, should also be included as an option.
Style
The style of the notification includes elements such as shape, background colors, border colors, font, text size, and text color. Allow individual notifications to override the default settings.
Notification Types
There are many different types of notifications for such things as: progression, timer completion, quests, events, rewards, achievements, winner, etc. For each notification type, the number of content areas, design, size, and location of these notifications could be quite different.
Individual Notification Overrides
Allow individual notifications to override the default settings. For example, a creator may want to use the default settings for standard notifications, but different settings for important notifications (such as a different background color, text color, image, sound, longer duration, etc).
Decide how to implement the overrides. These can be done via individual parameters, or perhaps a style definition similar to CSS. The goal is to allow individual notifications to customize as many notification properties as possible.
API
Consider using Lua Modules so that developers can easily require and call the module functions. Ideally, a creator should be able to call your API in a simple manner (such as: MyNotificationModule:SendNotification(parameters, …).
Helpful Code
-
You are permitted to use the existing code in Farmer’s Market and Mergelandia as a starting point or reference.
-
For animating and moving UI elements, a really helpful API is located in CC, which is named EaseUI by NicholasForeman.
Notes
-
Include a readme file that describes how to use your content. Make it as easy as possible for other developers to understand how to implement your system.
-
Scripts should use clean, readable code with extensive comments.
-
Custom properties should include ToolTip descriptions (right click and choose Set Custom Property ToolTip).
-
Please review the content best practices.
Requirements
-
Create a notification system with as many of the features above as possible.
-
Design at least three different notification types as described above.
-
Include sample code that shows others how to use your API.
Questions?
If you have any questions, then please post them to this topic.
SUBMITTING YOUR WORK
Submitting Your Work
- Your application acceptance message includes instructions on how to submit your work.
- Entrants must submit their work by the deadline listed in the Challenge in order to be considered for payment.
- Failure to submit your work on time may affect your eligibility for future Challenges.
MORE INFORMATION
More Information
For detailed information about the rules, judging criteria, and best practices please visit the Challenge Board Info & Rules post.