SALT Mobile extensions

0 votes
asked Aug 14, 2019 in Wanted features by kjw
edited Aug 14, 2019

Hi I have been getting familiar with the Salt (Wireframe) functionality and was wondering 
how it could be extended with styles and some features from other 
projects to promote a mobile theme. Using IOS as an example here but generic would do.

This is a bit of a fanatasy mashup but it would be good to polish up the Salt Project for presentations and other documents.

Following list scrapped from :

Icons and Images
App Icons

Launch Screens
-Describes Screen Sizes

System Icons - /ios/icons-and-images/system-icons/
(&share) Share Icon
(&add) Add Icon
(&book) Bookmarks Icon
(&camera) Camera Icon
(&cancel) Cancel Icon
(&fforward) Fast Forward Icon
(&glass) Search Icon

Other Icons
(&lt) Left < Icon
(&gt) Right > Icon
(&plus) Plus Icon

Navigation Bars - /ios/bars/navigation-bars
||<centre>[[All][Missed]]</centre>|| -Sort Centred Buttons

Search Bars -/ios/bars/search-bars/
||[(&glass) Search ..]|| -Full width Search Bar
||[(&glass) Search | ..]|| -Half Width Search Bar
||<centre>[(&glass) Search]</centre>|| -Centered Search Bar

Scope Bars - 

||[All Mailboxes][Current Mailboxes]|| -Full width Scope Bar

Status Bar

Tab Bar /ios/bars/tab-bars/

|| "(&multi)\n Photos" | "(&run)\n Memories" |(&cloud)\n Shared|(&vanish) \n Albums ||

Tool Bar

Buttons - /ios/controls/buttons/
(+) Add Button
(i) Info Button
(t) Tick Button
(x) Cross Button
(|>) Play Button

Context Menu - /ios/controls/context-menus/

(&copy) Copy Icon
(&share) Share Icon
(&love) Favourite Icom
(&multi) Show All Icon
(&trash) Remove Icon

Page Controls - /ios/controls/page-controls/
[(*..)] small indicator dots left hightlight
[(.*.)] small indicator dots centre hightlight
[(..*)] small indicator dots right hightlight

Sliders - /ios/controls/sliders/

||(&leftSlider)|| Full width knob left
||(&rightSlider)|| Full width knob centre
||(&centrelider)|| Full width knob right
||(&dim)(&rightSlider)(&bight)|| Full width knob centre

Switch /ios/controls/switches/

List not complete but indicative


!define IOSPuml

!includeurl IOSPuml/IOSCommon.puml

!includeurl IOSPuml/icons/all.puml

skinparam applescreenX 320px

skinparam applescreenY 568px

skinparam ios {



    BackgroundColor IOS_BG_COLOR

    BorderColor IOS_BORDER_COLOR


screen <<IOS>>{

  ||No SIM <&wifi> | <&bluetooth> <&battery-full>||

  ||< <centre>My Mobile Page</center>||




  ||To do something, select Option1 | *

  ||-- | --

  ||Operation1 | (&offSwitch)

  ||-- | --

  ||Link to View1 | >

  ||-- | --

  ||Link to View2 | >

  ||-- | --

  ||Link to View3 | >

  ||-- | --

  ||<br:6> '6 breaking lines

  ||-- | --

  ||(&home)Home | (i)help  | (&glass) Search) | apply

  ||-- | --

} as screen1


Your answer

Your name to display (optional):
Privacy: Your email address will only be used for sending these notifications.
Anti-spam verification:

[Antispam2 Feature: please please wait 1 or 2 minutes (this message will disappear) before pressing the button otherwise it will fail](--------)
To avoid this verification in future, please log in or register.