Introduction

Introducing NeoGeo for Excel

Information Dialog with Ribbon Button and HTML Scrollable Text Area in a Neo Geo Style for Excel (32bit or 64bit, Version 16) · Build Beautiful, Modern UserForms for Excel

NeoGeo is an Information Dialog for Excel featuring a modern interface, created using a modified Geometric Vector Bitmap image loaded directly into a UserForm Picture member. It is triggered via the Ribbon, by pressing the 'NeoGeo (Geometric)' Button on the 'Information' Group of the 'Awesome Software' Tab on the Ribbon. It has an interactive Close Cross to Unload the UserForm. There is a Scrollable, HTML WebBrowser, Content Text Area where you can add up to three parts of Text to describe your Software and adjust the Colours of the Scrollbar Face and Track. NeoGeo uses my minified Extensibility Class for Excel (redacted from my UserForm-Extensibility Class) to make some aspects of interactivity easier like adding a Hand Cursor to a UserForm when you hover over the Close Cross or allowing parts of a UserForm to be transparent and / or dragged by the Mouse. All of the Credits for Images are in the Download File together with links for Purchasing Vectors (where I have used Free or Pro licenses myself) to enable you to develop this Software further should you so wish

There are two ways to view the NeoGeo Dialog in my File, either via the Ribbon Button or by simply clicking the Example Button - see the Usage section for more information

You are purchasing NeoGeo v1 which includes a '400px' x '368px', 'NeoGeo1.bmp' Bitmap loaded into a UserForm Dialog, a 'Title.afdesign' Affinty File with the Text 'Info' in a Bauhaus 93 Font, two 'Close_Cross.afdesign' and 'Close_Cross_Active.afdesign' Affinity Files for the Close Cross, in two purple Colours, a Ribbon image 'Ribbon.png' which is a small 32px by 32px PNG image of the original Vector Geometric design, used by the Custom UI XML Markup, two transparent PNG's, 'Close_Cross.png and 'Close_Cross_Active.png' and the Extensibility Class. All of the transparent PNG images can be loaded into images Controls on the UserForm via my ImageTransparency.xlsm Software (which is included). You also get a method using my Code to download and create Dialogs. You can also purchase forks of this Software #forks


 

If you love NeoGeo, you may also like any of the following Software, in particular the Splash (Bauhaus) Software. Boho MP3 Player uses my UserForm Extensibility Software as the interface for all of its dialogs

About (Bauhaus) ·  Splash (Bauhaus) ·  Minimilist Card ·  WebLabelDialog ·  RetroDialog ·  DialogBox ·  LogoBox ·  Speech Bubbles ·  Info Bubble ·  Warning Msg ·  Info Msg ·  Question Msg ·  Error Msg ·  Userform Extensibility ·  Boho MP3 Player ·  Mint UserForm ·  Slate UserForm ·  Lightbox UserForm ·  Dark UI ·  Blue UI ·  Carbon UI ·  UserFOrm UI ·  BoX ·  Flat UI ·  UserForm Slider Buttons

Prerequisites

• Microsoft Excel 2016 Version 16 (32bit or 64bit) · designed for Office 365 Windows 11
• Basic to moderate Excel Skills and some basic VBA skills
• Windows PC · NOT a Mac!
• No support is provided for customization of this Software

Features

• Irregular UserForm with their Captions or Titlebars removed and containing images using a special Transparency Colour, ie. White, RGB(255, 255, 255), to hide parts that should be transparent
• A Transparent '400px' x '368px' Bitmap loaded directly into the UserForm
• The UserForm and Title/Strapline Labels are Dragable using the Mouse
• Looks great on any Colour Background in the Excel Workbook
• An Interactive Close Cross in two purple Colours
• A Scrollable HTML Text Area that can take up to 3 Text parts (you can set these in the Code)
• A Ribbon Tab with a single 'Info' Button that will trigger the Dialog (similar to the Example Button)
• Adjustable Scrollbar Face and Track Colours
• Google Fonts is used by the WebBrowser to render the Font 'Rajdhani' which is a 'sans-serif' Font and it is used with two weights at '400' and '600'

Fonts

The Font used throughout this Software in Excel is called 'Rajdhani' which is a 'sans-serif' Font and it is used with two weights at '400' and '600'. It is pulled down directly from Google Fonts & Icons. This Font WILL follow the Workbook as it is rendered from Google each time that the Workbook is opened. The Title is an image using the Font 'Bauhaus 93'. You can use any Font to create Text in images using Affinity Designer or Photoshop and load these directly into Image Controls on your UserForm. There are a couple methods to embed Fonts within the Worksheet of a Workbook and I have Software called FontHeads that does just this, so that the Font follows the Workbook and is written out from within the Worksheet to a temporary File and then installed on the fly as the Workbook is opened each time. You can also use embedded Objects (True Type Fonts) in Excel to include Fonts in Excel and I have some free Software to demonstrate this technique here (enter the word Font in the 'Search for Project Name...' Box and a couple of Files will popup that you can download and try, the main one being Embedding Multiple Fonts.xlsb which include free Fonts, 'Ostrich.ttf', 'Pacifico.ttf', 'Caviar Dreams.ttf' and 'Blackjack.ttf'

Credits

Neo Geo Geometric Vector by MD. YEAMIN FATHA purchased under a Vecteezy Pro license. You can view and purchase the file here. Single isolated image used as the Info Dialog loaded as a '400px' x '368px' Bitmap directly into the UserForm. Please note: the original Vector is NOT included with this Software, only modified 'lower' resolution parts are used for loading into the Excel UserForm and / or image Controls

Bauhaus Elements Background for Excel by Jovan Aditya Pangestu, downloaded under a Pro License one-size, modified colour-wise to match the Geometric Vector used for this Project, reduced and embedded into Excel, not for backward dissasembly). Please note: regardless of the license, no attempt should be made to extract this image. You can view and purchase the file here

Close Cross by Ульяна Москальчук, downloaded under a Pro License (isolated, one-size .PNG copies only to load into Image Controls and create the interaction via VBA Code). You can view and purchase the file here

Extensibility Class, UserForm Enabler for Interactivity by Mark Kubiszyn redacted from UserForm Extensibility for Excel

Installation

Right-click and extract the contents of the File NeoGeo.zip. The 'NeoGeo1.bmp' Bitmap is stored in the 'bmps' Folder, all of the Transparent images are stored in the 'transparent images' Folder and any Affinity Files are stored in the 'affinity' Folder. I also include my free ImageTransparency.xlsm Software and the Test.xlsm Workbook I use in the Usage Section. Open NeoGeo.xlsm and test the Example

To use NeoGeo (Geometric) in your own Projects open NeoGeo.xlsm and your own Macro-enabled Project. Then open the VBE (Visual Basic Editor) and drag the Ribbon Code Module, the Examples Code Module, the Extensibility Class and the About1 UserForm into your Project. Configure the Example Code in the Examples Code Module if required - you could display the UserForm directly from the Ribbon Code Module. Finally you will need to add the Custom UI part to your Workbook before you can use the Ribbon Button to trigger your NeoGeo (Geometric) Info Dialog or you will get errors in the Code in the 'Ribbon' Code Module - see the Usage Section

Take some time to examine how NeoGeo (Geometric) works and read the Usage Section in this online documentation before you begin to create your own Info Boxes for Excel or before turning to Support

Usage

How to use NeoGeo

First of all, what is NeoGeo?
NeoGeo is an Information Dialog for Excel featuring a modern interface, created using a modified Geometric Vector Bitmap image loaded directly into a UserForm Picture member. It is triggered via the Ribbon, by pressing the 'NeoGeo (Geometric)' Button on the 'Information' Group of the 'Awesome Software' Tab on the Ribbon. It has an interactive Close Cross to Unload the UserForm. There is a Scrollable, HTML WebBrowser, Content Text Area where you can add up to three parts of Text to describe your Software and adjust the Colours of the Scrollbar Face and Track. NeoGeo uses my minified Extensibility Class for Excel (redacted from my UserForm-Extensibility Class) to make some aspects of interactivity easier like adding a Hand Cursor to a UserForm when you hover over the Close Cross or allowing parts of a UserForm to be transparent and / or dragged by the Mouse

The Ribbon Button
Press the 'NeoGeo (Geometric)' Ribbon Button which is in the 'Information' Group of the 'Awesome Software' Tab on the Ribbon to trigger the Info Dialog. The Code to do this is in the 'Ribbon' and 'Examples' Code Modules as shown below (the part R.ActivateTab "Awesome_Software_Tab" will force the 'Awesome Software' Tab to be set when the Workook is opened):

' Ribbon Code Module
Option Explicit

Private R As IRibbonUI

Public Sub RibbonLoaded(ByRef Ribbon As IRibbonUI)
   Set R = Ribbon
   R.ActivateTab "Awesome_Software_Tab"
End Sub

Public Sub UpdateOnAction(ByRef control As IRibbonControl)
   Select Case control.ID
   Case "About_Button"
      Example1
   End Select
End Sub

' Examples Code Module
Option Explicit
Option Private Module

Public Sub Example1()
   With NeoGeo1
      If .Visible = True Then Exit Sub
      ' display the UserForm
      .Show 0
   End With
End Sub

How to Use NeoGeo (Geometric) in your own Projects
To use NeoGeo in your own Projects open About.xlsm and your own Macro-enabled Project. Then open the VBE (Visual Basic Editor) and drag the Ribbon Code Module, the Extensibility Class and the About1 UserForm into your Project. Add and configure the Example Code in the Examples Code Module. Finally you will need to add the Custom UI part to your Workbook before you can use the Ribbon Button to trigger your NeoGeo Dialog or you will get errors in the Code in the 'Ribbon' Code Module

So, how to do that? Well first of all dowload the Custom UI Editor. I have hosted the File as I cannot find it anywhere nowadays and think it may be unsupported but there are other alternatives if you google 'Office Custom UI Editor For Microsoft Office Tool'. Once you have the Tool set up, create a new Macro-enabled Excel File and open the VBE (Visual Basic Editor) and drag the Ribbon Code Module, the Extensibility Class and the About1 UserForm into your Project. Add and configure the Example Code in the Examples Code Module as this is required just to run the Example (you can change this Code to run directly from the Ribbon Code Module if you want). Save this File. Then open the Custom UI Editor and open the Excel File that you just saved. I called my new Workbook 'Test.xlsm'. From the menu, Insert a new Office 2010 Custom UI Part like this:



Now Copy my XML Markup into your Custom UI Editor:

<!--NeoGeo (Geometric) Info Dialog for Excel by Mark Kubiszyn-->
<customUI 
	xmlns="http://schemas.microsoft.com/office/2009/07/customui"
	onLoad="RibbonLoaded">
	
	<ribbon startFromScratch="false" >
		<tabs>
				<tab id="Awesome_Software_Tab" label="Awesome Software" insertAfterMso="TabHome">
				<group 
				id="Awesome_Software_Group"
				label="Information">

				<button 
				id="About_Button"
				image="Icon"
				label="NeoGeo (Geometric)"
				size="large"
				supertip="Read more information on this Software"
				tag="NeoGeo (Geometric)"
				onAction="UpdateOnAction"/>

			</group >
			</tab>
		</tabs>
	</ribbon >
</customUI >

Your Custom UI Editor should look like this:



Next from the Menu choose, Insert Icons and browse to my 'Ribbon.png' image in the Download File in the 'transparent images' folder and open it. Right-click on the Icon Name and choose 'Change ID'. Name the Image 'Icon' in the Custom UI Editor. Save the XML. Finally your XML should look like this:



Close the File from the Custom UI Menu. Now Open the Workbook again. I will open my 'Test.xlsm' File. If all went well, then you should see something like this, a new Workbook with a Ribbon Tab and Button that triggers the About Dialog:



Changing the Text in the Scrollable HTML Text Area
The Scrollable Text Area is really a WebBrowser Control. You can change the Text Parts of this Control by going into the VBE Editor and into the 'ABout' UserForm Code Module where you will see three Strings right at the top of the Code Module. The first two Strings have been populated and the third String has not (you could leave it as vbNullString if you like):

' Text content parts used by the HTML Markup to render the Scrollable Text Area
Private Const Content1 As String = "Licensed to: Acme Ltd<br />Version: 1<br />Date: 27/03/2023<br />Author: Mark Kubiszyn"
Private Const Content2 As String = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Praesent in massa ligula. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In justo lectus, aliquam sed est ut, sodales fringilla massa. Ut porta id est non hendrerit. Nunc sapien arcu, interdum id efficitur nec, elementum non magna. Suspendisse suscipit commodo eros in laoreet. Vivamus eget turpis mi. Sed efficitur in ipsum id molestie"
Private Const Content3 As String = ""

To change the Text then, simply edit the Strings. You can use HTML Tags in the Text (Psuedo Markup) if you like as it will be read into the HTML used by the WebBrowser Control. Look I will make some simple changes and then you can see what it looks like. Please note: if you do not add enough Text then the Control may display incorrectly - it is designed for a lot of information, however I may tweak this in future releases. Anyhow after making my changes you can now see the new Text (you can even add links to open new Browser Windows):

' Text content parts used by the HTML Markup to render the Scrollable Text Area
Private Const Content1 As String = "<b>Author:</b> Mark Kubiszyn aka. www.kubiszyn.co.uk"
Private Const Content2 As String = "This Software can be purchased through FastSpring on my Website <a href=""https://www.kubiszyn.co.uk/documentation/neogeo.html"" target=""_blank"">www.kubiszyn.co.uk/</a>"
Private Const Content3 As String = "I hope that you love this Software and can find a really good use for it in your owm Projects"

Adjustable Scrollbar Face and Track Colours
You can change the HTML Colours for both the Scrollbar Face Colour and the Trackbar Colour. Open the VBE Editor. Go into the 'About1' Code Module and locate the line that begins like this (ignore the brackets)

[ = v & ".scrollable {margin-right:]'...

Then scroll right along until you find the 'scrollbar-face-color:' CSS styling and change the HTML Code after this to any HTML Colour that you like. This changes the Scrollbar Colour. To change the Scrollbar Track Colour scroll further along the line until you find 'scrollbar-track-color:' CSS styling and change the HTML Code after this to any HTML Colour that you like. HTML Colour Codes together with the CSS styling need to be in this format:

' bright Salmon and Grey Colours for you to change
scrollbar-face-color: #FF8F6E;
scrollbar-track-color: #CCC;

Extensibility Class
The Extensibility Class is required for Card to remove the Caption and Borders from a UserForm. It also allows the White colour to become transparent so that you can use irregular Window Sizes for the UserForm via a '.BMP' (Bitmap) image. It allows a number of simple ways to extend your UserForms, for example to make them (or any Control) draggable use the following Code:

Option Explicit

Private Self As New Extensibility

' UserForm
Private Sub UserForm_Initialize()
   Set Self.Assign = Me
End Sub

Private Sub UserForm_MouseDown(ByVal Button As Integer, ByVal Shift As Integer, ByVal X As Single, ByVal Y As Single)
   Self.AllowDrag
End Sub

To show a hand Cursor use the following Code:

Option Explicit

Private Self As New Extensibility

' UserForm
Private Sub UserForm_Initialize()
   Set Self.Assign = Me
End Sub

Private Sub Close_Cross_Active_MouseMove(ByVal Button As Integer, ByVal Shift As Integer, ByVal X As Single, ByVal Y As Single)
   Self.AddCursor IDC_HAND
End Sub

To remove the Caption, Borders and allow Transparency of White (a Long Colour Code) use the following Code:

Option Explicit

Private Self As New Extensibility

' UserForm
Private Sub UserForm_Initialize()
   Set Self.Assign = Me
   Self.RemoveCaptionBordersAndSetTransparency 16777215  
End Sub

Modal or Modeless?
The About Screen can also be a Modal Dialog by swapping the zero (0) for a 1 like this:

 Public Sub Example1()
   With NeoGeo1
      If .Visible = True Then Exit Sub
      ' display the UserForm
      .Show 1
   End With
End Sub

How did I do this
First of all I downloaded the original Vector used for this Project - see links above (this is NOT free). Then I isolated the Image I needed using Affinity Designer (my go-to image manipulation tool) - link in the Download File. I exported out the image at 400px x 368px as a Transparent .PNG. From here, I opened the image in Photoshop and carefully made some pixel changes. I also ran over the Transparent parts with White RGB(255, 255, 255) so that they would be rendered invisible once loaded into the UserForm and ran with my Code I saved the image as a .BMP (Bitmap). Then I loaded the image directly into the Picture member of the UserForm

For the Title I designed this image in Affinity Designer from scratch with a RGB(254, 254, 254) background and used a Font called 'Bauhaus 93' and the Text, 'Info'. I exported this out as a Transparent .PNG and then using my ImageTransparency.xlsm Software, loaded it into an image Control on the UserForm

Image Processes - Loading in a Bitmap to a UserForm or Control
An easy way of getting an image into a UserForm or one of its Controls is to load a transparent '.GIF' or '.BMP' (Bitmap) image directly. Use the 'Picture' member to Browse and load the File. You can create a transparent 'GIF' directly from an art package such as Affinity Designer. To create a Bitmap you can use Photoshop to take any Transparent Image saved as a '.PNG' and convert it by using 'Save As' into a Bitmap, choose Format 'BMP (*.BMP;*.RLE;*.DIB)', File Format 'Windows' and Depth '24 Bit'. Where you need to have the Background Colour a different Colour from standard White '255, 255, 255' for your Bitmap, because for example you are using White as the Transparent Colour, which would cause holes in your image, then use the Paint Bucket Tool, selecting an alternative Colour by entering the RGB Values ie. '254, 254, 254' together with settings, Opacity '100%', Tolerance '30' and tick the Anti Alias checkbox

Image Processes - Loading in a Transparent PNG to a UserForm or Control
A trick I use all of the time is to use my Free ImageTransparency.xlsm Software to load in a Transparent '.PNG' File into a UserForm or one of its Controls - you can download this free here. This technique allows you to load any PNG and then Paste it into the Picture member of the UserForm or Control. You MUST set the background Colour 'BackColor' of the UserForm or Control in the single UserForm within the ImageTransparency.xlsm File first and this should be a VB Hex Colour - use a great Tool like 'InstantEyeDropper' to do this, it's free and can be downloaded from here. Now press the 'Copy to Clipboard' Button in the ImageTransparency.xlsm Software to Browse and load in the PNG File. Switch to Excel and Paste into the Picture member. The PNG image will now be added to the UserForm or Control and the Transparent Colour will be replaced by the VB Hex Colour that you used for the BackColor of the UserFrom or Control

Image Processes - Another Method to Load an Image into a Control
You can load in a transparent 'PNG' image into Affinity and add a Layer that is a Rectangle and set it to the background Colour you want it to have once it is loaded ie. White for the transparency. Export out that image as a '.PNG' image again. Now load it into Photoshop and Save it as a '.BMP' image. Finally load this Bitmap directly into any Image Control and it will sit ontop of the background and appear to blend in perfectly

Screen Shots

NeoGeo is an Information Dialog for Excel featuring a modern interface, created using a modified Geometric Vector Bitmap image loaded directly into a UserForm Picture member

The NeoGeo (Geometric) Dialog with alternative Scrollbar Face and Track Colours

The NeoGeo Info Dialog displayed ontop of the Software - you can trigger the Info Dialog via the Ribbon, by pressing the 'NeoGeo (Geometric)' Button on the 'Information' Group of the 'Awesome Software' Tab on the Ribbon or by the Example Button

FAQ

* There are no frequently asked questions for NeoGeo

---

NeoGeo Videos

This is a video of the NeoGeo Software. Music is 'Little Fish - Quincas Moreira'. View this video on YouTube or view the YouTube Short

Other forked videos are also available:
NeoGeo-fork1

Shorts & Reels

This is video of fork #1 of NeoGeo. Music is 'Firefly - Quincas Moreira' · view this NeoGeo-fork1 video on YouTube

Support

Please remember you have purchased very affordable Software and you have not paid for a full-time Software design agency - I am but one man. Occasionally I may help with small tweaks, but these requests will be put on a much lower priority due to their nature. You have not PAID for Support, Support is 100% optional and I provide it for your convenience, so please be patient, polite and respectful

Support (limited) for my Software includes

• Responding to questions or problems regarding the Software and its features
• Fixing valid (replicated) bugs and reported issues for the VERSION I HAVE WRITTEN

Software support does not include

• Customization and installation services
• Support for third party software or ANY kind of development whatsoever

Before seeking support

• Make sure your question is a valid Software Issue and not a customization request
• Make sure you have read through the FAQ's, online documentation and any related video guides before asking support on how to accomplish a task
• Ensure that you access to the VBOM is allowed and that Macros can run in Excel
• Make sure to provide 'proof of purchase' and state the name / version of the Software that you are having issues with when requesting support by Email or via Facebook

How to get Support

Contact Mark Kubiszyn on the Email address provided when you purchased the Software, including the Order Number
...or Contact Mark Kubiszyn via our Facebook Page - remember to be patient, if there has been an issue with your download, Mark will always respond within 48 hours and will Email you the File directly if neccessary or via Messenger. For other issues the response time may be considerably longer and I may choose to respond to specific questions only (as is my right), depending on what has been asked

Future Builds

* No ideas as yet!

Bug Fixes

* There are currently no bugs identified for NeoGeo

Fonts

Fonts

The Font used throughout this Software in Excel is called 'Rajdhani' which is a 'sans-serif' Font and it is used with two weights at '400' and '600'. It is pulled down directly from Google Fonts & Icons. This Font WILL follow the Workbook as it is rendered from Google each time that the Workbook is opened. The Title is an image using the Font 'Bauhaus 93'. You can use any Font to create Text in images using Affinity Designer or Photoshop and load these directly into Image Controls on your UserForm. There are a couple methods to embed Fonts within the Worksheet of a Workbook and I have Software called FontHeads that does just this, so that the Font follows the Workbook and is written out from within the Worksheet to a temporary File and then installed on the fly as the Workbook is opened each time. You can also use embedded Objects (True Type Fonts) in Excel to include Fonts in Excel and I have some free Software to demonstrate this technique here (enter the word Font in the 'Search for Project Name...' Box and a couple of Files will popup that you can download and try, the main one being Embedding Multiple Fonts.xlsb which include free Fonts, 'Ostrich.ttf', 'Pacifico.ttf', 'Caviar Dreams.ttf' and 'Blackjack.ttf'

Credits

Credits

Neo Geo Geometric Vector by MD. YEAMIN FATHA purchased under a Vecteezy Pro license. You can view and purchase the file here. Single isolated image used as the Info Dialog loaded as a '400px' x '368px' Bitmap directly into the UserForm. Please note: the original Vector is NOT included with this Software, only modified 'lower' resolution parts are used for loading into the Excel UserForm and / or image Controls

Bauhaus Elements Background for Excel by Jovan Aditya Pangestu, downloaded under a Pro License one-size, modified colour-wise to match the Geometric Vector used for this Project, reduced and embedded into Excel, not for backward dissasembly). Please note: regardless of the license, no attempt should be made to extract this image. You can view and purchase the file here

Close Cross by Ульяна Москальчук, downloaded under a Pro License (isolated, one-size .PNG copies only to load into Image Controls and create the interaction via VBA Code). You can view and purchase the file here

Extensibility Class, UserForm Enabler for Interactivity by Mark Kubiszyn redacted from UserForm Extensibility for Excel

#forks

Additional forks of NeoGeo

fork#1

A fork by Paradigm, using a Vector by MD. YEAMIN FATHA purchased under a Vecteezy Pro license. You can view and purchase the file here
- forked videos:
NeoGeo-fork1

Purchase · £2.99

---

Changelog

Read more information on the status of each release below. The latest Version including a description of any changes is shown first

30.03.2023 - (Version 1)

General release of NeoGeo

---